diff options
author | Chocobozzz <me@florianbigard.com> | 2017-12-12 11:38:02 +0100 |
---|---|---|
committer | Chocobozzz <me@florianbigard.com> | 2017-12-12 11:42:48 +0100 |
commit | 7bfd1b1edb7ea4ea6516b6a74c4e9af938d0bdc6 (patch) | |
tree | 722781d5d89fe438e7491da7e9d09dedd8c82a74 /client/config/webpack.common.js | |
parent | 63c4db6d71b98523753c51747e308682d9a2e8a0 (diff) | |
download | PeerTube-7bfd1b1edb7ea4ea6516b6a74c4e9af938d0bdc6.tar.gz PeerTube-7bfd1b1edb7ea4ea6516b6a74c4e9af938d0bdc6.tar.zst PeerTube-7bfd1b1edb7ea4ea6516b6a74c4e9af938d0bdc6.zip |
Upgrade scripts and embed webpack config
Diffstat (limited to 'client/config/webpack.common.js')
-rw-r--r-- | client/config/webpack.common.js | 338 |
1 files changed, 0 insertions, 338 deletions
diff --git a/client/config/webpack.common.js b/client/config/webpack.common.js deleted file mode 100644 index f387b44f9..000000000 --- a/client/config/webpack.common.js +++ /dev/null | |||
@@ -1,338 +0,0 @@ | |||
1 | const helpers = require('./helpers') | ||
2 | |||
3 | /* | ||
4 | * Webpack Plugins | ||
5 | */ | ||
6 | |||
7 | const AssetsPlugin = require('assets-webpack-plugin') | ||
8 | const ContextReplacementPlugin = require('webpack/lib/ContextReplacementPlugin') | ||
9 | const CommonsChunkPlugin = require('webpack/lib/optimize/CommonsChunkPlugin') | ||
10 | const CheckerPlugin = require('awesome-typescript-loader').CheckerPlugin | ||
11 | const HtmlWebpackPlugin = require('html-webpack-plugin') | ||
12 | const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin') | ||
13 | const ScriptExtHtmlWebpackPlugin = require('script-ext-html-webpack-plugin') | ||
14 | const InlineManifestWebpackPlugin = require('inline-manifest-webpack-plugin') | ||
15 | const ngcWebpack = require('ngc-webpack') | ||
16 | const CopyWebpackPlugin = require('copy-webpack-plugin') | ||
17 | |||
18 | const WebpackNotifierPlugin = require('webpack-notifier') | ||
19 | |||
20 | const HMR = helpers.hasProcessFlag('hot') | ||
21 | const AOT = process.env.BUILD_AOT || helpers.hasNpmFlag('aot') | ||
22 | const METADATA = { | ||
23 | title: 'PeerTube', | ||
24 | baseUrl: '/', | ||
25 | isDevServer: helpers.isWebpackDevServer(), | ||
26 | HMR: HMR, | ||
27 | AOT: AOT | ||
28 | } | ||
29 | |||
30 | /* | ||
31 | * Webpack configuration | ||
32 | * | ||
33 | * See: http://webpack.github.io/docs/configuration.html#cli | ||
34 | */ | ||
35 | module.exports = function (options) { | ||
36 | const isProd = options.env === 'production' | ||
37 | const AOT = isProd | ||
38 | |||
39 | return { | ||
40 | |||
41 | /* | ||
42 | * Cache generated modules and chunks to improve performance for multiple incremental builds. | ||
43 | * This is enabled by default in watch mode. | ||
44 | * You can pass false to disable it. | ||
45 | * | ||
46 | * See: http://webpack.github.io/docs/configuration.html#cache | ||
47 | */ | ||
48 | // cache: false, | ||
49 | |||
50 | /* | ||
51 | * The entry point for the bundle | ||
52 | * Our Angular.js app | ||
53 | * | ||
54 | * See: http://webpack.github.io/docs/configuration.html#entry | ||
55 | */ | ||
56 | entry: { | ||
57 | 'polyfills': './src/polyfills.browser.ts', | ||
58 | 'main': AOT | ||
59 | ? './src/main.browser.aot.ts' | ||
60 | : './src/main.browser.ts' | ||
61 | }, | ||
62 | |||
63 | /* | ||
64 | * Options affecting the resolving of modules. | ||
65 | * | ||
66 | * See: http://webpack.github.io/docs/configuration.html#resolve | ||
67 | */ | ||
68 | resolve: { | ||
69 | /* | ||
70 | * An array of extensions that should be used to resolve modules. | ||
71 | * | ||
72 | * See: http://webpack.github.io/docs/configuration.html#resolve-extensions | ||
73 | */ | ||
74 | extensions: [ '.ts', '.js', '.json', '.scss' ], | ||
75 | |||
76 | modules: [ helpers.root('src'), helpers.root('node_modules') ] | ||
77 | }, | ||
78 | |||
79 | /* | ||
80 | * Options affecting the normal modules. | ||
81 | * | ||
82 | * See: http://webpack.github.io/docs/configuration.html#module | ||
83 | */ | ||
84 | module: { | ||
85 | |||
86 | rules: [ | ||
87 | |||
88 | /* | ||
89 | * Typescript loader support for .ts and Angular async routes via .async.ts | ||
90 | * | ||
91 | * See: https://github.com/s-panferov/awesome-typescript-loader | ||
92 | */ | ||
93 | { | ||
94 | test: /\.ts$/, | ||
95 | use: [ | ||
96 | { | ||
97 | loader: 'ng-router-loader', | ||
98 | options: { | ||
99 | loader: 'async-import', | ||
100 | genDir: 'compiled', | ||
101 | aot: AOT | ||
102 | } | ||
103 | }, | ||
104 | { | ||
105 | loader: 'awesome-typescript-loader', | ||
106 | options: { | ||
107 | configFileName: 'tsconfig.webpack.json', | ||
108 | useCache: !isProd | ||
109 | } | ||
110 | }, | ||
111 | { | ||
112 | loader: 'angular2-template-loader' | ||
113 | } | ||
114 | ], | ||
115 | exclude: [/\.(spec|e2e)\.ts$/] | ||
116 | }, | ||
117 | |||
118 | /* | ||
119 | * Json loader support for *.json files. | ||
120 | * | ||
121 | * See: https://github.com/webpack/json-loader | ||
122 | */ | ||
123 | { | ||
124 | test: /\.json$/, | ||
125 | use: 'json-loader' | ||
126 | }, | ||
127 | |||
128 | { | ||
129 | test: /\.(sass|scss)$/, | ||
130 | use: [ | ||
131 | 'css-to-string-loader', | ||
132 | { | ||
133 | loader: 'css-loader', | ||
134 | options: { | ||
135 | sourceMap: true, | ||
136 | importLoaders: 1 | ||
137 | } | ||
138 | }, | ||
139 | 'resolve-url-loader', | ||
140 | { | ||
141 | loader: 'sass-loader', | ||
142 | options: { | ||
143 | sourceMap: true | ||
144 | } | ||
145 | }, | ||
146 | { | ||
147 | loader: 'sass-resources-loader', | ||
148 | options: { | ||
149 | resources: [ | ||
150 | helpers.root('src/sass/_variables.scss'), | ||
151 | helpers.root('src/sass/_mixins.scss') | ||
152 | ] | ||
153 | } | ||
154 | } | ||
155 | ] | ||
156 | }, | ||
157 | { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'url-loader?limit=10000&minetype=application/font-woff' }, | ||
158 | { test: /\.(otf|ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'url-loader?limit=10000' }, | ||
159 | |||
160 | /* Raw loader support for *.html | ||
161 | * Returns file content as string | ||
162 | * | ||
163 | * See: https://github.com/webpack/raw-loader | ||
164 | */ | ||
165 | { | ||
166 | test: /\.html$/, | ||
167 | use: 'raw-loader', | ||
168 | exclude: [ | ||
169 | helpers.root('src/index.html'), | ||
170 | helpers.root('src/standalone/videos/embed.html') | ||
171 | ] | ||
172 | }, | ||
173 | |||
174 | /* File loader for supporting images, for example, in CSS files. | ||
175 | */ | ||
176 | { | ||
177 | test: /\.(jpg|png|gif)$/, | ||
178 | use: 'url-loader' | ||
179 | } | ||
180 | |||
181 | ] | ||
182 | |||
183 | }, | ||
184 | |||
185 | /* | ||
186 | * Add additional plugins to the compiler. | ||
187 | * | ||
188 | * See: http://webpack.github.io/docs/configuration.html#plugins | ||
189 | */ | ||
190 | plugins: [ | ||
191 | new AssetsPlugin({ | ||
192 | path: helpers.root('dist'), | ||
193 | filename: 'webpack-assets.json', | ||
194 | prettyPrint: true | ||
195 | }), | ||
196 | |||
197 | /* | ||
198 | * Plugin: ForkCheckerPlugin | ||
199 | * Description: Do type checking in a separate process, so webpack don't need to wait. | ||
200 | * | ||
201 | * See: https://github.com/s-panferov/awesome-typescript-loader#forkchecker-boolean-defaultfalse | ||
202 | */ | ||
203 | new CheckerPlugin(), | ||
204 | |||
205 | /* | ||
206 | * Plugin: CommonsChunkPlugin | ||
207 | * Description: Shares common code between the pages. | ||
208 | * It identifies common modules and put them into a commons chunk. | ||
209 | * | ||
210 | * See: https://webpack.github.io/docs/list-of-plugins.html#commonschunkplugin | ||
211 | * See: https://github.com/webpack/docs/wiki/optimization#multi-page-app | ||
212 | */ | ||
213 | new CommonsChunkPlugin({ | ||
214 | name: 'polyfills', | ||
215 | chunks: ['polyfills'] | ||
216 | }), | ||
217 | |||
218 | // This enables tree shaking of the vendor modules | ||
219 | new CommonsChunkPlugin({ | ||
220 | name: 'vendor', | ||
221 | chunks: ['main'], | ||
222 | minChunks: module => { | ||
223 | return /node_modules\//.test(module.resource) | ||
224 | } | ||
225 | }), | ||
226 | |||
227 | // Specify the correct order the scripts will be injected in | ||
228 | new CommonsChunkPlugin({ | ||
229 | name: ['polyfills', 'vendor'].reverse() | ||
230 | }), | ||
231 | |||
232 | /** | ||
233 | * Plugin: ContextReplacementPlugin | ||
234 | * Description: Provides context to Angular's use of System.import | ||
235 | * | ||
236 | * See: https://webpack.github.io/docs/list-of-plugins.html#contextreplacementplugin | ||
237 | * See: https://github.com/angular/angular/issues/11580 | ||
238 | */ | ||
239 | new ContextReplacementPlugin( | ||
240 | /** | ||
241 | * The (\\|\/) piece accounts for path separators in *nix and Windows | ||
242 | */ | ||
243 | /(.+)?angular(\\|\/)core(.+)?/, | ||
244 | helpers.root('src'), // location of your src | ||
245 | { | ||
246 | /** | ||
247 | * Your Angular Async Route paths relative to this root directory | ||
248 | */ | ||
249 | } | ||
250 | ), | ||
251 | |||
252 | /* | ||
253 | * Plugin: HtmlWebpackPlugin | ||
254 | * Description: Simplifies creation of HTML files to serve your webpack bundles. | ||
255 | * This is especially useful for webpack bundles that include a hash in the filename | ||
256 | * which changes every compilation. | ||
257 | * | ||
258 | * See: https://github.com/ampedandwired/html-webpack-plugin | ||
259 | */ | ||
260 | new HtmlWebpackPlugin({ | ||
261 | template: 'src/index.html', | ||
262 | title: METADATA.title, | ||
263 | chunksSortMode: function (a, b) { | ||
264 | const entryPoints = [ 'inline', 'polyfills', 'sw-register', 'styles', 'vendor', 'main' ] | ||
265 | return entryPoints.indexOf(a.names[0]) - entryPoints.indexOf(b.names[0]) | ||
266 | }, | ||
267 | metadata: METADATA, | ||
268 | inject: 'body' | ||
269 | }), | ||
270 | |||
271 | new CopyWebpackPlugin([ | ||
272 | { | ||
273 | from: helpers.root('src/assets/images/favicon.png'), | ||
274 | to: 'assets/images/favicon.png' | ||
275 | }, | ||
276 | { | ||
277 | from: helpers.root('src/assets/images/default-avatar.png'), | ||
278 | to: 'assets/images/default-avatar.png' | ||
279 | } | ||
280 | ]), | ||
281 | |||
282 | /* | ||
283 | * Plugin: ScriptExtHtmlWebpackPlugin | ||
284 | * Description: Enhances html-webpack-plugin functionality | ||
285 | * with different deployment options for your scripts including: | ||
286 | * | ||
287 | * See: https://github.com/numical/script-ext-html-webpack-plugin | ||
288 | */ | ||
289 | new ScriptExtHtmlWebpackPlugin({ | ||
290 | sync: [ /polyfill|vendor/ ], | ||
291 | defaultAttribute: 'async', | ||
292 | preload: [/polyfill|vendor|main/], | ||
293 | prefetch: [/chunk/] | ||
294 | }), | ||
295 | |||
296 | new WebpackNotifierPlugin({ alwaysNotify: true }), | ||
297 | |||
298 | /** | ||
299 | * Plugin LoaderOptionsPlugin (experimental) | ||
300 | * | ||
301 | * See: https://gist.github.com/sokra/27b24881210b56bbaff7 | ||
302 | */ | ||
303 | new LoaderOptionsPlugin({ | ||
304 | options: { | ||
305 | context: '', | ||
306 | sassLoader: { | ||
307 | precision: 10, | ||
308 | includePaths: [ helpers.root('src/sass') ] | ||
309 | } | ||
310 | } | ||
311 | }), | ||
312 | |||
313 | new ngcWebpack.NgcWebpackPlugin({ | ||
314 | disabled: !AOT, | ||
315 | tsConfig: helpers.root('tsconfig.webpack.json') | ||
316 | }), | ||
317 | |||
318 | new InlineManifestWebpackPlugin() | ||
319 | ], | ||
320 | |||
321 | /* | ||
322 | * Include polyfills or mocks for various node stuff | ||
323 | * Description: Node configuration | ||
324 | * | ||
325 | * See: https://webpack.github.io/docs/configuration.html#node | ||
326 | */ | ||
327 | node: { | ||
328 | global: true, | ||
329 | crypto: 'empty', | ||
330 | process: true, | ||
331 | module: false, | ||
332 | clearImmediate: false, | ||
333 | setImmediate: false, | ||
334 | setInterval: false, | ||
335 | setTimeout: false | ||
336 | } | ||
337 | } | ||
338 | } | ||