aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2017-09-06 21:48:15 +0200
committerChocobozzz <florian.bigard@gmail.com>2017-09-06 21:48:15 +0200
commit04de542abd940f9d2ca213fba3c68580c6c9b78a (patch)
tree13549c2d25883ca6a215536fff319f761d3786bf /client
parenta8b5de6c670eb19ffbe40726bb60ef1d1dbc10dd (diff)
downloadPeerTube-04de542abd940f9d2ca213fba3c68580c6c9b78a.tar.gz
PeerTube-04de542abd940f9d2ca213fba3c68580c6c9b78a.tar.zst
PeerTube-04de542abd940f9d2ca213fba3c68580c6c9b78a.zip
Update webpack config
Diffstat (limited to 'client')
-rw-r--r--client/config/empty.js3
-rw-r--r--client/config/webpack.common.js23
-rw-r--r--client/config/webpack.dev.js21
-rw-r--r--client/config/webpack.prod.js100
-rw-r--r--client/package.json1
-rw-r--r--client/src/app/app-routing.module.ts9
-rw-r--r--client/src/main.browser.ts28
7 files changed, 88 insertions, 97 deletions
diff --git a/client/config/empty.js b/client/config/empty.js
index 33acae188..a5c628d81 100644
--- a/client/config/empty.js
+++ b/client/config/empty.js
@@ -1,4 +1,7 @@
1module.exports = { 1module.exports = {
2 hmrModule: function (ngmodule) {
3 return ngmodule
4 },
2 NgProbeToken: {}, 5 NgProbeToken: {},
3 HmrState: function () {}, 6 HmrState: function () {},
4 _createConditionalRootRenderer: function (rootRenderer, extraTokens, coreTokens) { 7 _createConditionalRootRenderer: function (rootRenderer, extraTokens, coreTokens) {
diff --git a/client/config/webpack.common.js b/client/config/webpack.common.js
index 489803f22..7392c58d3 100644
--- a/client/config/webpack.common.js
+++ b/client/config/webpack.common.js
@@ -16,13 +16,14 @@ const ngcWebpack = require('ngc-webpack')
16 16
17const WebpackNotifierPlugin = require('webpack-notifier') 17const WebpackNotifierPlugin = require('webpack-notifier')
18 18
19/* 19const HMR = helpers.hasProcessFlag('hot')
20 * Webpack Constants 20const AOT = process.env.BUILD_AOT || helpers.hasNpmFlag('aot')
21 */
22const METADATA = { 21const METADATA = {
23 title: 'PeerTube', 22 title: 'PeerTube',
24 baseUrl: '/', 23 baseUrl: '/',
25 isDevServer: helpers.isWebpackDevServer() 24 isDevServer: helpers.isWebpackDevServer(),
25 HMR: HMR,
26 AOT: AOT
26} 27}
27 28
28/* 29/*
@@ -92,13 +93,6 @@ module.exports = function (options) {
92 test: /\.ts$/, 93 test: /\.ts$/,
93 use: [ 94 use: [
94 { 95 {
95 loader: '@angularclass/hmr-loader',
96 options: {
97 pretty: !isProd,
98 prod: isProd
99 }
100 },
101 {
102 loader: 'ng-router-loader', 96 loader: 'ng-router-loader',
103 options: { 97 options: {
104 loader: 'async-import', 98 loader: 'async-import',
@@ -242,7 +236,7 @@ module.exports = function (options) {
242 /** 236 /**
243 * The (\\|\/) piece accounts for path separators in *nix and Windows 237 * The (\\|\/) piece accounts for path separators in *nix and Windows
244 */ 238 */
245 /angular(\\|\/)core(\\|\/)@angular/, 239 /(.+)?angular(\\|\/)core(.+)?/,
246 helpers.root('src'), // location of your src 240 helpers.root('src'), // location of your src
247 { 241 {
248 /** 242 /**
@@ -276,7 +270,10 @@ module.exports = function (options) {
276 new HtmlWebpackPlugin({ 270 new HtmlWebpackPlugin({
277 template: 'src/index.html', 271 template: 'src/index.html',
278 title: METADATA.title, 272 title: METADATA.title,
279 chunksSortMode: 'dependency', 273 chunksSortMode: function (a, b) {
274 const entryPoints = [ 'inline', 'polyfills', 'sw-register', 'styles', 'vendor', 'main' ]
275 return entryPoints.indexOf(a.names[0]) - entryPoints.indexOf(b.names[0])
276 },
280 metadata: METADATA, 277 metadata: METADATA,
281 inject: 'body' 278 inject: 'body'
282 }), 279 }),
diff --git a/client/config/webpack.dev.js b/client/config/webpack.dev.js
index 9cf09db0f..8948af9b2 100644
--- a/client/config/webpack.dev.js
+++ b/client/config/webpack.dev.js
@@ -11,6 +11,7 @@ const AddAssetHtmlPlugin = require('add-asset-html-webpack-plugin')
11const DefinePlugin = require('webpack/lib/DefinePlugin') 11const DefinePlugin = require('webpack/lib/DefinePlugin')
12const NamedModulesPlugin = require('webpack/lib/NamedModulesPlugin') 12const NamedModulesPlugin = require('webpack/lib/NamedModulesPlugin')
13const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin') 13const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin')
14const HotModuleReplacementPlugin = require('webpack/lib/HotModuleReplacementPlugin')
14 15
15/** 16/**
16 * Webpack Constants 17 * Webpack Constants
@@ -18,14 +19,18 @@ const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin')
18const ENV = process.env.ENV = process.env.NODE_ENV = 'development' 19const ENV = process.env.ENV = process.env.NODE_ENV = 'development'
19const HOST = process.env.HOST || 'localhost' 20const HOST = process.env.HOST || 'localhost'
20const PORT = process.env.PORT || 3000 21const PORT = process.env.PORT || 3000
22const PUBLIC = process.env.PUBLIC_DEV || HOST + ':' + PORT
23const AOT = process.env.BUILD_AOT || helpers.hasNpmFlag('aot')
21const HMR = helpers.hasProcessFlag('hot') 24const HMR = helpers.hasProcessFlag('hot')
22const METADATA = webpackMerge(commonConfig({env: ENV}).metadata, { 25const METADATA = {
23 host: HOST, 26 host: HOST,
24 port: PORT, 27 port: PORT,
28 public: PUBLIC,
25 ENV: ENV, 29 ENV: ENV,
26 HMR: HMR, 30 HMR: HMR,
31 AOT: AOT,
27 API_URL: 'http://localhost:9000' 32 API_URL: 'http://localhost:9000'
28}) 33}
29 34
30const DllBundlesPlugin = require('webpack-dll-bundles-plugin').DllBundlesPlugin 35const DllBundlesPlugin = require('webpack-dll-bundles-plugin').DllBundlesPlugin
31 36
@@ -125,11 +130,9 @@ module.exports = function (env) {
125 'HMR': METADATA.HMR, 130 'HMR': METADATA.HMR,
126 'API_URL': JSON.stringify(METADATA.API_URL), 131 'API_URL': JSON.stringify(METADATA.API_URL),
127 'process.version': JSON.stringify(process.version), 132 'process.version': JSON.stringify(process.version),
128 'process.env': { 133 'process.env.ENV': JSON.stringify(METADATA.ENV),
129 'ENV': JSON.stringify(METADATA.ENV), 134 'process.env.NODE_ENV': JSON.stringify(METADATA.ENV),
130 'NODE_ENV': JSON.stringify(METADATA.ENV), 135 'process.env.HMR': METADATA.HMR
131 'HMR': METADATA.HMR
132 }
133 }), 136 }),
134 137
135 new DllBundlesPlugin({ 138 new DllBundlesPlugin({
@@ -216,8 +219,9 @@ module.exports = function (env) {
216 } 219 }
217 220
218 } 221 }
219 }) 222 }),
220 223
224 new HotModuleReplacementPlugin()
221 ], 225 ],
222 226
223 /** 227 /**
@@ -232,6 +236,7 @@ module.exports = function (env) {
232 port: METADATA.port, 236 port: METADATA.port,
233 host: METADATA.host, 237 host: METADATA.host,
234 historyApiFallback: true, 238 historyApiFallback: true,
239 hot: METADATA.HMR,
235 watchOptions: { 240 watchOptions: {
236 ignored: /node_modules/ 241 ignored: /node_modules/
237 } 242 }
diff --git a/client/config/webpack.prod.js b/client/config/webpack.prod.js
index ddc9343a7..b950d3fe5 100644
--- a/client/config/webpack.prod.js
+++ b/client/config/webpack.prod.js
@@ -14,22 +14,24 @@ const DefinePlugin = require('webpack/lib/DefinePlugin')
14const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin') 14const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin')
15const NormalModuleReplacementPlugin = require('webpack/lib/NormalModuleReplacementPlugin') 15const NormalModuleReplacementPlugin = require('webpack/lib/NormalModuleReplacementPlugin')
16const OptimizeJsPlugin = require('optimize-js-plugin') 16const OptimizeJsPlugin = require('optimize-js-plugin')
17const UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin')
18const HashedModuleIdsPlugin = require('webpack/lib/HashedModuleIdsPlugin') 17const HashedModuleIdsPlugin = require('webpack/lib/HashedModuleIdsPlugin')
19 18const ModuleConcatenationPlugin = require('webpack/lib/optimize/ModuleConcatenationPlugin')
19const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
20/** 20/**
21 * Webpack Constants 21 * Webpack Constants
22 */ 22 */
23const ENV = process.env.NODE_ENV = process.env.ENV = 'production' 23const ENV = process.env.NODE_ENV = process.env.ENV = 'production'
24const HOST = process.env.HOST || 'localhost' 24const HOST = process.env.HOST || 'localhost'
25const PORT = process.env.PORT || 8080 25const PORT = process.env.PORT || 8080
26const METADATA = webpackMerge(commonConfig({env: ENV}).metadata, { 26const AOT = process.env.BUILD_AOT || helpers.hasNpmFlag('aot')
27const METADATA = {
27 host: HOST, 28 host: HOST,
28 port: PORT, 29 port: PORT,
29 ENV: ENV, 30 ENV: ENV,
30 HMR: false, 31 HMR: false,
32 AOT: AOT,
31 API_URL: '' 33 API_URL: ''
32}) 34}
33 35
34module.exports = function (env) { 36module.exports = function (env) {
35 return [ 37 return [
@@ -106,6 +108,7 @@ module.exports = function (env) {
106 * See: http://webpack.github.io/docs/configuration.html#plugins 108 * See: http://webpack.github.io/docs/configuration.html#plugins
107 */ 109 */
108 plugins: [ 110 plugins: [
111 new ModuleConcatenationPlugin(),
109 112
110 /** 113 /**
111 * Webpack plugin to optimize a JavaScript file for faster initial load 114 * Webpack plugin to optimize a JavaScript file for faster initial load
@@ -142,12 +145,11 @@ module.exports = function (env) {
142 'ENV': JSON.stringify(METADATA.ENV), 145 'ENV': JSON.stringify(METADATA.ENV),
143 'HMR': METADATA.HMR, 146 'HMR': METADATA.HMR,
144 'API_URL': JSON.stringify(METADATA.API_URL), 147 'API_URL': JSON.stringify(METADATA.API_URL),
148 'AOT': METADATA.AOT,
145 'process.version': JSON.stringify(process.version), 149 'process.version': JSON.stringify(process.version),
146 'process.env': { 150 'process.env.ENV': JSON.stringify(METADATA.ENV),
147 'ENV': JSON.stringify(METADATA.ENV), 151 'process.env.NODE_ENV': JSON.stringify(METADATA.ENV),
148 'NODE_ENV': JSON.stringify(METADATA.ENV), 152 'process.env.HMR': METADATA.HMR
149 'HMR': METADATA.HMR
150 }
151 }), 153 }),
152 154
153 /** 155 /**
@@ -159,44 +161,28 @@ module.exports = function (env) {
159 */ 161 */
160 // NOTE: To debug prod builds uncomment //debug lines and comment //prod lines 162 // NOTE: To debug prod builds uncomment //debug lines and comment //prod lines
161 new UglifyJsPlugin({ 163 new UglifyJsPlugin({
162 // beautify: true, //debug 164 parallel: true,
163 // mangle: false, //debug 165 uglifyOptions: {
164 // dead_code: false, //debug 166 ie8: false,
165 // unused: false, //debug 167 ecma: 6,
166 // deadCode: false, //debug 168 warnings: true,
167 // compress: { 169 mangle: true,
168 // screw_ie8: true, 170 output: {
169 // keep_fnames: true, 171 comments: false,
170 // drop_debugger: false, 172 beautify: false
171 // dead_code: false, 173 }
172 // unused: false 174 },
173 // }, // debug 175 warnings: true
174 // comments: true, //debug
175
176 beautify: false, // prod
177 output: {
178 comments: false
179 }, // prod
180 mangle: {
181 screw_ie8: true
182 }, // prod
183 compress: {
184 screw_ie8: true,
185 warnings: false,
186 conditionals: true,
187 unused: true,
188 comparisons: true,
189 sequences: true,
190 dead_code: true,
191 evaluate: true,
192 if_return: true,
193 join_vars: true,
194 negate_iife: false // we need this for lazy v8
195 }
196 }), 176 }),
197 177
178 /**
179 * Plugin: NormalModuleReplacementPlugin
180 * Description: Replace resources that matches resourceRegExp with newResource
181 *
182 * See: http://webpack.github.io/docs/list-of-plugins.html#normalmodulereplacementplugin
183 */
198 new NormalModuleReplacementPlugin( 184 new NormalModuleReplacementPlugin(
199 /angular2-hmr/, 185 /(angular2|@angularclass)((\\|\/)|-)hmr/,
200 helpers.root('config/empty.js') 186 helpers.root('config/empty.js')
201 ), 187 ),
202 188
@@ -208,26 +194,14 @@ module.exports = function (env) {
208 new HashedModuleIdsPlugin(), 194 new HashedModuleIdsPlugin(),
209 195
210 /** 196 /**
211 * Plugin: IgnorePlugin 197 * AoT
212 * Description: Don’t generate modules for requests matching the provided RegExp.
213 *
214 * See: http://webpack.github.io/docs/list-of-plugins.html#ignoreplugin
215 */
216
217 // new IgnorePlugin(/angular2-hmr/),
218
219 /**
220 * Plugin: CompressionPlugin
221 * Description: Prepares compressed versions of assets to serve
222 * them with Content-Encoding
223 *
224 * See: https://github.com/webpack/compression-webpack-plugin
225 */ 198 */
226 // install compression-webpack-plugin 199 (AOT ? (
227 // new CompressionPlugin({ 200 new NormalModuleReplacementPlugin(
228 // regExp: /\.css$|\.html$|\.js$|\.map$/, 201 /@angular(\\|\/)compiler/,
229 // threshold: 2 * 1024 202 helpers.root('config/empty.js')
230 // }) 203 )
204 ) : (new LoaderOptionsPlugin({}))),
231 205
232 /** 206 /**
233 * Plugin LoaderOptionsPlugin (experimental) 207 * Plugin LoaderOptionsPlugin (experimental)
diff --git a/client/package.json b/client/package.json
index f1c7e8799..d69a7b10b 100644
--- a/client/package.json
+++ b/client/package.json
@@ -101,6 +101,7 @@
101 "purifycss-webpack": "^0.7.0", 101 "purifycss-webpack": "^0.7.0",
102 "standard": "^10.0.0", 102 "standard": "^10.0.0",
103 "tslint-config-standard": "^6.0.1", 103 "tslint-config-standard": "^6.0.1",
104 "uglifyjs-webpack-plugin": "^0.4.6",
104 "webpack-bundle-analyzer": "^2.8.2", 105 "webpack-bundle-analyzer": "^2.8.2",
105 "webpack-dev-server": "^2.4.5", 106 "webpack-dev-server": "^2.4.5",
106 "webpack-dll-bundles-plugin": "^1.0.0-beta.5" 107 "webpack-dll-bundles-plugin": "^1.0.0-beta.5"
diff --git a/client/src/app/app-routing.module.ts b/client/src/app/app-routing.module.ts
index 8036c52e6..191ae6974 100644
--- a/client/src/app/app-routing.module.ts
+++ b/client/src/app/app-routing.module.ts
@@ -1,5 +1,5 @@
1import { NgModule } from '@angular/core' 1import { NgModule } from '@angular/core'
2import { Routes, RouterModule } from '@angular/router' 2import { Routes, RouterModule, PreloadAllModules } from '@angular/router'
3 3
4const routes: Routes = [ 4const routes: Routes = [
5 { 5 {
@@ -14,7 +14,12 @@ const routes: Routes = [
14] 14]
15 15
16@NgModule({ 16@NgModule({
17 imports: [ RouterModule.forRoot(routes) ], 17 imports: [
18 RouterModule.forRoot(routes, {
19 useHash: Boolean(history.pushState) === false,
20 preloadingStrategy: PreloadAllModules
21 })
22 ],
18 exports: [ RouterModule ] 23 exports: [ RouterModule ]
19}) 24})
20export class AppRoutingModule {} 25export class AppRoutingModule {}
diff --git a/client/src/main.browser.ts b/client/src/main.browser.ts
index aeae06e04..28f0d5781 100644
--- a/client/src/main.browser.ts
+++ b/client/src/main.browser.ts
@@ -1,22 +1,28 @@
1/* tslint: disable */ 1/* tslint: disable */
2 2
3import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'
4import { decorateModuleRef } from './app/environment'; 4import { decorateModuleRef } from './app/environment'
5import { hmrModule } from '@angularclass/hmr'
5 6
6/** 7/**
7 * App Module 8 * App Module
8 * our top level module that holds all of our components 9 * our top level module that holds all of our components
9 */ 10 */
10import { AppModule } from './app'; 11import { AppModule } from './app'
11 12
12/** 13/**
13 * Bootstrap our Angular app with a top level NgModule 14 * Bootstrap our Angular app with a top level NgModule
14 */ 15 */
15export function main(): Promise<any> { 16export function main (): Promise<any> {
16 return platformBrowserDynamic() 17 return platformBrowserDynamic()
17 .bootstrapModule(AppModule) 18 .bootstrapModule(AppModule)
18 .then(decorateModuleRef) 19 .then(decorateModuleRef)
19 .catch((err) => console.error(err)); 20 .then((ngModuleRef: any) => {
21 // `module` global ref for webpackhmr
22 // Don't run this in Prod
23 return hmrModule(ngModuleRef, module)
24 })
25 .catch((err) => console.error(err))
20} 26}
21 27
22/** 28/**
@@ -25,15 +31,15 @@ export function main(): Promise<any> {
25 */ 31 */
26switch (document.readyState) { 32switch (document.readyState) {
27 case 'loading': 33 case 'loading':
28 document.addEventListener('DOMContentLoaded', _domReadyHandler, false); 34 document.addEventListener('DOMContentLoaded', _domReadyHandler, false)
29 break; 35 break
30 case 'interactive': 36 case 'interactive':
31 case 'complete': 37 case 'complete':
32 default: 38 default:
33 main(); 39 main()
34} 40}
35 41
36function _domReadyHandler() { 42function _domReadyHandler () {
37 document.removeEventListener('DOMContentLoaded', _domReadyHandler, false); 43 document.removeEventListener('DOMContentLoaded', _domReadyHandler, false)
38 main(); 44 main()
39} 45}