aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/config
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2017-07-23 14:49:52 +0200
committerChocobozzz <florian.bigard@gmail.com>2017-07-23 15:10:57 +0200
commit202e72231750705b1a071d57206424eef1fc5be1 (patch)
treeaf19fc202d51764132d59cd0e99874c7de356f50 /client/config
parent0c31c33dcb0baaa8d3aeedb63336dfe2ae6e5585 (diff)
downloadPeerTube-202e72231750705b1a071d57206424eef1fc5be1.tar.gz
PeerTube-202e72231750705b1a071d57206424eef1fc5be1.tar.zst
PeerTube-202e72231750705b1a071d57206424eef1fc5be1.zip
Process embed in webpack too
Diffstat (limited to 'client/config')
-rw-r--r--client/config/webpack.common.js42
-rw-r--r--client/config/webpack.dev.js392
-rw-r--r--client/config/webpack.prod.js455
-rw-r--r--client/config/webpack.video-embed.js183
4 files changed, 612 insertions, 460 deletions
diff --git a/client/config/webpack.common.js b/client/config/webpack.common.js
index da900da85..5f6d254cc 100644
--- a/client/config/webpack.common.js
+++ b/client/config/webpack.common.js
@@ -8,7 +8,6 @@ const AssetsPlugin = require('assets-webpack-plugin')
8const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin 8const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
9const ContextReplacementPlugin = require('webpack/lib/ContextReplacementPlugin') 9const ContextReplacementPlugin = require('webpack/lib/ContextReplacementPlugin')
10const CommonsChunkPlugin = require('webpack/lib/optimize/CommonsChunkPlugin') 10const CommonsChunkPlugin = require('webpack/lib/optimize/CommonsChunkPlugin')
11const CopyWebpackPlugin = require('copy-webpack-plugin')
12const CheckerPlugin = require('awesome-typescript-loader').CheckerPlugin 11const CheckerPlugin = require('awesome-typescript-loader').CheckerPlugin
13const HtmlWebpackPlugin = require('html-webpack-plugin') 12const HtmlWebpackPlugin = require('html-webpack-plugin')
14const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin') 13const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin')
@@ -253,47 +252,6 @@ module.exports = function (options) {
253 ), 252 ),
254 253
255 /* 254 /*
256 * Plugin: CopyWebpackPlugin
257 * Description: Copy files and directories in webpack.
258 *
259 * Copies project static assets.
260 *
261 * See: https://www.npmjs.com/package/copy-webpack-plugin
262 */
263
264 // Used by embed.html
265 new CopyWebpackPlugin([
266 {
267 from: 'src/assets',
268 to: 'assets'
269 },
270 {
271 from: 'node_modules/webtorrent/webtorrent.min.js',
272 to: 'assets/webtorrent'
273 },
274 {
275 from: 'node_modules/video.js/dist/video.min.js',
276 to: 'assets/video-js'
277 },
278 {
279 from: 'node_modules/video.js/dist/video-js.min.css',
280 to: 'assets/video-js'
281 },
282 {
283 from: 'node_modules/videojs-dock/dist/videojs-dock.min.js',
284 to: 'assets/video-js'
285 },
286 {
287 from: 'node_modules/videojs-dock/dist/videojs-dock.css',
288 to: 'assets/video-js'
289 },
290 {
291 from: 'src/standalone',
292 to: 'standalone'
293 }
294 ]),
295
296 /*
297 * Plugin: ScriptExtHtmlWebpackPlugin 255 * Plugin: ScriptExtHtmlWebpackPlugin
298 * Description: Enhances html-webpack-plugin functionality 256 * Description: Enhances html-webpack-plugin functionality
299 * with different deployment options for your scripts including: 257 * with different deployment options for your scripts including:
diff --git a/client/config/webpack.dev.js b/client/config/webpack.dev.js
index c472ac762..9cf09db0f 100644
--- a/client/config/webpack.dev.js
+++ b/client/config/webpack.dev.js
@@ -2,6 +2,7 @@ const helpers = require('./helpers')
2const webpackMerge = require('webpack-merge') // used to merge webpack configs 2const webpackMerge = require('webpack-merge') // used to merge webpack configs
3const webpackMergeDll = webpackMerge.strategy({plugins: 'replace'}) 3const webpackMergeDll = webpackMerge.strategy({plugins: 'replace'})
4const commonConfig = require('./webpack.common.js') // the settings that are common to prod and dev 4const commonConfig = require('./webpack.common.js') // the settings that are common to prod and dev
5const videoEmbedConfig = require('./webpack.video-embed.js')
5 6
6/** 7/**
7 * Webpack Plugins 8 * Webpack Plugins
@@ -34,220 +35,225 @@ const DllBundlesPlugin = require('webpack-dll-bundles-plugin').DllBundlesPlugin
34 * See: http://webpack.github.io/docs/configuration.html#cli 35 * See: http://webpack.github.io/docs/configuration.html#cli
35 */ 36 */
36module.exports = function (env) { 37module.exports = function (env) {
37 return webpackMerge(commonConfig({ env: ENV }), { 38 return [
38 /**
39 * Developer tool to enhance debugging
40 *
41 * See: http://webpack.github.io/docs/configuration.html#devtool
42 * See: https://github.com/webpack/docs/wiki/build-performance#sourcemaps
43 */
44 devtool: 'cheap-module-source-map',
45
46 /**
47 * Options affecting the output of the compilation.
48 *
49 * See: http://webpack.github.io/docs/configuration.html#output
50 */
51 output: {
52 /**
53 * The output directory as absolute path (required).
54 *
55 * See: http://webpack.github.io/docs/configuration.html#output-path
56 */
57 path: helpers.root('dist'),
58 39
40 webpackMerge(commonConfig({ env: ENV }), {
59 /** 41 /**
60 * Specifies the name of each output file on disk. 42 * Developer tool to enhance debugging
61 * IMPORTANT: You must not specify an absolute path here!
62 * 43 *
63 * See: http://webpack.github.io/docs/configuration.html#output-filename 44 * See: http://webpack.github.io/docs/configuration.html#devtool
45 * See: https://github.com/webpack/docs/wiki/build-performance#sourcemaps
64 */ 46 */
65 filename: '[name].bundle.js', 47 devtool: 'cheap-module-source-map',
66 48
67 /** 49 /**
68 * The filename of the SourceMaps for the JavaScript files. 50 * Options affecting the output of the compilation.
69 * They are inside the output.path directory.
70 * 51 *
71 * See: http://webpack.github.io/docs/configuration.html#output-sourcemapfilename 52 * See: http://webpack.github.io/docs/configuration.html#output
72 */ 53 */
73 sourceMapFilename: '[name].map', 54 output: {
55 /**
56 * The output directory as absolute path (required).
57 *
58 * See: http://webpack.github.io/docs/configuration.html#output-path
59 */
60 path: helpers.root('dist'),
74 61
75 /** The filename of non-entry chunks as relative path 62 /**
76 * inside the output.path directory. 63 * Specifies the name of each output file on disk.
77 * 64 * IMPORTANT: You must not specify an absolute path here!
78 * See: http://webpack.github.io/docs/configuration.html#output-chunkfilename 65 *
79 */ 66 * See: http://webpack.github.io/docs/configuration.html#output-filename
80 chunkFilename: '[id].chunk.js', 67 */
81 68 filename: '[name].bundle.js',
82 library: 'ac_[name]',
83 libraryTarget: 'var'
84 },
85
86 module: {
87
88 // Too slow, life is short
89 // rules: [
90 // {
91 // test: /\.ts$/,
92 // use: [
93 // {
94 // loader: 'tslint-loader',
95 // options: {
96 // configFile: 'tslint.json'
97 // }
98 // }
99 // ],
100 // exclude: [
101 // /\.(spec|e2e)\.ts$/,
102 // /node_modules\//
103 // ]
104 // }
105 // ]
106 },
107
108 plugins: [
109 69
110 /** 70 /**
111 * Plugin: DefinePlugin 71 * The filename of the SourceMaps for the JavaScript files.
112 * Description: Define free variables. 72 * They are inside the output.path directory.
113 * Useful for having development builds with debug logging or adding global constants. 73 *
114 * 74 * See: http://webpack.github.io/docs/configuration.html#output-sourcemapfilename
115 * Environment helpers 75 */
116 * 76 sourceMapFilename: '[name].map',
117 * See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin 77
118 */ 78 /** The filename of non-entry chunks as relative path
119 // NOTE: when adding more properties, make sure you include them in custom-typings.d.ts 79 * inside the output.path directory.
120 new DefinePlugin({ 80 *
121 'ENV': JSON.stringify(METADATA.ENV), 81 * See: http://webpack.github.io/docs/configuration.html#output-chunkfilename
122 'HMR': METADATA.HMR, 82 */
123 'API_URL': JSON.stringify(METADATA.API_URL), 83 chunkFilename: '[id].chunk.js',
124 'process.version': JSON.stringify(process.version), 84
125 'process.env': { 85 library: 'ac_[name]',
86 libraryTarget: 'var'
87 },
88
89 module: {
90
91 // Too slow, life is short
92 // rules: [
93 // {
94 // test: /\.ts$/,
95 // use: [
96 // {
97 // loader: 'tslint-loader',
98 // options: {
99 // configFile: 'tslint.json'
100 // }
101 // }
102 // ],
103 // exclude: [
104 // /\.(spec|e2e)\.ts$/,
105 // /node_modules\//
106 // ]
107 // }
108 // ]
109 },
110
111 plugins: [
112
113 /**
114 * Plugin: DefinePlugin
115 * Description: Define free variables.
116 * Useful for having development builds with debug logging or adding global constants.
117 *
118 * Environment helpers
119 *
120 * See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
121 */
122 // NOTE: when adding more properties, make sure you include them in custom-typings.d.ts
123 new DefinePlugin({
126 'ENV': JSON.stringify(METADATA.ENV), 124 'ENV': JSON.stringify(METADATA.ENV),
127 'NODE_ENV': JSON.stringify(METADATA.ENV), 125 'HMR': METADATA.HMR,
128 'HMR': METADATA.HMR 126 'API_URL': JSON.stringify(METADATA.API_URL),
129 } 127 'process.version': JSON.stringify(process.version),
130 }), 128 'process.env': {
131 129 'ENV': JSON.stringify(METADATA.ENV),
132 new DllBundlesPlugin({ 130 'NODE_ENV': JSON.stringify(METADATA.ENV),
133 bundles: { 131 'HMR': METADATA.HMR
134 polyfills: [ 132 }
135 'core-js', 133 }),
136 { 134
137 name: 'zone.js', 135 new DllBundlesPlugin({
138 path: 'zone.js/dist/zone.js' 136 bundles: {
137 polyfills: [
138 'core-js',
139 {
140 name: 'zone.js',
141 path: 'zone.js/dist/zone.js'
142 },
143 {
144 name: 'zone.js',
145 path: 'zone.js/dist/long-stack-trace-zone.js'
146 }
147 ],
148 vendor: [
149 '@angular/platform-browser',
150 '@angular/platform-browser-dynamic',
151 '@angular/core',
152 '@angular/common',
153 '@angular/forms',
154 '@angular/http',
155 '@angular/router',
156 '@angularclass/hmr',
157 'rxjs'
158 ]
159 },
160 dllDir: helpers.root('dll'),
161 webpackConfig: webpackMergeDll(commonConfig({env: ENV}), {
162 devtool: 'cheap-module-source-map',
163 plugins: []
164 })
165 }),
166
167 /**
168 * Plugin: AddAssetHtmlPlugin
169 * Description: Adds the given JS or CSS file to the files
170 * Webpack knows about, and put it into the list of assets
171 * html-webpack-plugin injects into the generated html.
172 *
173 * See: https://github.com/SimenB/add-asset-html-webpack-plugin
174 */
175 new AddAssetHtmlPlugin([
176 { filepath: helpers.root(`dll/${DllBundlesPlugin.resolveFile('polyfills')}`) },
177 { filepath: helpers.root(`dll/${DllBundlesPlugin.resolveFile('vendor')}`) }
178 ]),
179
180 /**
181 * Plugin: NamedModulesPlugin (experimental)
182 * Description: Uses file names as module name.
183 *
184 * See: https://github.com/webpack/webpack/commit/a04ffb928365b19feb75087c63f13cadfc08e1eb
185 */
186 new NamedModulesPlugin(),
187
188 /**
189 * Plugin LoaderOptionsPlugin (experimental)
190 *
191 * See: https://gist.github.com/sokra/27b24881210b56bbaff7
192 */
193 new LoaderOptionsPlugin({
194 debug: true,
195 options: {
196
197 /**
198 * Static analysis linter for TypeScript advanced options configuration
199 * Description: An extensible linter for the TypeScript language.
200 *
201 * See: https://github.com/wbuchwalter/tslint-loader
202 */
203 tslint: {
204 emitErrors: false,
205 failOnHint: false,
206 typeCheck: true,
207 resourcePath: 'src'
139 }, 208 },
140 { 209
141 name: 'zone.js', 210 // FIXME: Remove
142 path: 'zone.js/dist/long-stack-trace-zone.js' 211 // https://github.com/bholloway/resolve-url-loader/issues/36
212 // https://github.com/jtangelder/sass-loader/issues/289
213 context: __dirname,
214 output: {
215 path: helpers.root('dist')
143 } 216 }
144 ], 217
145 vendor: [ 218 }
146 '@angular/platform-browser',
147 '@angular/platform-browser-dynamic',
148 '@angular/core',
149 '@angular/common',
150 '@angular/forms',
151 '@angular/http',
152 '@angular/router',
153 '@angularclass/hmr',
154 'rxjs'
155 ]
156 },
157 dllDir: helpers.root('dll'),
158 webpackConfig: webpackMergeDll(commonConfig({env: ENV}), {
159 devtool: 'cheap-module-source-map',
160 plugins: []
161 }) 219 })
162 }),
163 220
164 /** 221 ],
165 * Plugin: AddAssetHtmlPlugin
166 * Description: Adds the given JS or CSS file to the files
167 * Webpack knows about, and put it into the list of assets
168 * html-webpack-plugin injects into the generated html.
169 *
170 * See: https://github.com/SimenB/add-asset-html-webpack-plugin
171 */
172 new AddAssetHtmlPlugin([
173 { filepath: helpers.root(`dll/${DllBundlesPlugin.resolveFile('polyfills')}`) },
174 { filepath: helpers.root(`dll/${DllBundlesPlugin.resolveFile('vendor')}`) }
175 ]),
176 222
177 /** 223 /**
178 * Plugin: NamedModulesPlugin (experimental) 224 * Webpack Development Server configuration
179 * Description: Uses file names as module name. 225 * Description: The webpack-dev-server is a little node.js Express server.
226 * The server emits information about the compilation state to the client,
227 * which reacts to those events.
180 * 228 *
181 * See: https://github.com/webpack/webpack/commit/a04ffb928365b19feb75087c63f13cadfc08e1eb 229 * See: https://webpack.github.io/docs/webpack-dev-server.html
182 */ 230 */
183 new NamedModulesPlugin(), 231 devServer: {
232 port: METADATA.port,
233 host: METADATA.host,
234 historyApiFallback: true,
235 watchOptions: {
236 ignored: /node_modules/
237 }
238 },
184 239
185 /** 240 /*
186 * Plugin LoaderOptionsPlugin (experimental) 241 * Include polyfills or mocks for various node stuff
242 * Description: Node configuration
187 * 243 *
188 * See: https://gist.github.com/sokra/27b24881210b56bbaff7 244 * See: https://webpack.github.io/docs/configuration.html#node
189 */ 245 */
190 new LoaderOptionsPlugin({ 246 node: {
191 debug: true, 247 global: true,
192 options: { 248 crypto: 'empty',
193 249 fs: 'empty',
194 /** 250 process: true,
195 * Static analysis linter for TypeScript advanced options configuration 251 module: false,
196 * Description: An extensible linter for the TypeScript language. 252 clearImmediate: false,
197 * 253 setImmediate: false
198 * See: https://github.com/wbuchwalter/tslint-loader
199 */
200 tslint: {
201 emitErrors: false,
202 failOnHint: false,
203 typeCheck: true,
204 resourcePath: 'src'
205 },
206
207 // FIXME: Remove
208 // https://github.com/bholloway/resolve-url-loader/issues/36
209 // https://github.com/jtangelder/sass-loader/issues/289
210 context: __dirname,
211 output: {
212 path: helpers.root('dist')
213 }
214
215 }
216 })
217
218 ],
219
220 /**
221 * Webpack Development Server configuration
222 * Description: The webpack-dev-server is a little node.js Express server.
223 * The server emits information about the compilation state to the client,
224 * which reacts to those events.
225 *
226 * See: https://webpack.github.io/docs/webpack-dev-server.html
227 */
228 devServer: {
229 port: METADATA.port,
230 host: METADATA.host,
231 historyApiFallback: true,
232 watchOptions: {
233 ignored: /node_modules/
234 } 254 }
235 }, 255 }),
236 256
237 /* 257 videoEmbedConfig({env: ENV})
238 * Include polyfills or mocks for various node stuff 258 ]
239 * Description: Node configuration
240 *
241 * See: https://webpack.github.io/docs/configuration.html#node
242 */
243 node: {
244 global: true,
245 crypto: 'empty',
246 fs: 'empty',
247 process: true,
248 module: false,
249 clearImmediate: false,
250 setImmediate: false
251 }
252 })
253} 259}
diff --git a/client/config/webpack.prod.js b/client/config/webpack.prod.js
index 4f33961f5..ddc9343a7 100644
--- a/client/config/webpack.prod.js
+++ b/client/config/webpack.prod.js
@@ -5,6 +5,7 @@
5const helpers = require('./helpers') 5const helpers = require('./helpers')
6const webpackMerge = require('webpack-merge') // used to merge webpack configs 6const webpackMerge = require('webpack-merge') // used to merge webpack configs
7const commonConfig = require('./webpack.common.js') // the settings that are common to prod and dev 7const commonConfig = require('./webpack.common.js') // the settings that are common to prod and dev
8const videoEmbedConfig = require('./webpack.video-embed.js')
8 9
9/** 10/**
10 * Webpack Plugins 11 * Webpack Plugins
@@ -31,266 +32,270 @@ const METADATA = webpackMerge(commonConfig({env: ENV}).metadata, {
31}) 32})
32 33
33module.exports = function (env) { 34module.exports = function (env) {
34 return webpackMerge(commonConfig({env: ENV}), { 35 return [
35 /** 36 videoEmbedConfig({ env: ENV }),
36 * Developer tool to enhance debugging
37 *
38 * See: http://webpack.github.io/docs/configuration.html#devtool
39 * See: https://github.com/webpack/docs/wiki/build-performance#sourcemaps
40 */
41 devtool: 'source-map',
42
43 /**
44 * Options affecting the output of the compilation.
45 *
46 * See: http://webpack.github.io/docs/configuration.html#output
47 */
48 output: {
49 37
38 webpackMerge(commonConfig({ env: ENV }), {
50 /** 39 /**
51 * The output directory as absolute path (required). 40 * Developer tool to enhance debugging
52 * 41 *
53 * See: http://webpack.github.io/docs/configuration.html#output-path 42 * See: http://webpack.github.io/docs/configuration.html#devtool
43 * See: https://github.com/webpack/docs/wiki/build-performance#sourcemaps
54 */ 44 */
55 path: helpers.root('dist'), 45 devtool: 'source-map',
56 46
57 /** 47 /**
58 * Specifies the name of each output file on disk. 48 * Options affecting the output of the compilation.
59 * IMPORTANT: You must not specify an absolute path here!
60 * 49 *
61 * See: http://webpack.github.io/docs/configuration.html#output-filename 50 * See: http://webpack.github.io/docs/configuration.html#output
62 */ 51 */
63 filename: '[name].[chunkhash].bundle.js', 52 output: {
64 53
65 /** 54 /**
66 * The filename of the SourceMaps for the JavaScript files. 55 * The output directory as absolute path (required).
67 * They are inside the output.path directory. 56 *
68 * 57 * See: http://webpack.github.io/docs/configuration.html#output-path
69 * See: http://webpack.github.io/docs/configuration.html#output-sourcemapfilename 58 */
70 */ 59 path: helpers.root('dist'),
71 sourceMapFilename: '[file].map',
72 60
73 /** 61 /**
74 * The filename of non-entry chunks as relative path 62 * Specifies the name of each output file on disk.
75 * inside the output.path directory. 63 * IMPORTANT: You must not specify an absolute path here!
76 * 64 *
77 * See: http://webpack.github.io/docs/configuration.html#output-chunkfilename 65 * See: http://webpack.github.io/docs/configuration.html#output-filename
78 */ 66 */
79 chunkFilename: '[name].[chunkhash].chunk.js', 67 filename: '[name].[chunkhash].bundle.js',
68
69 /**
70 * The filename of the SourceMaps for the JavaScript files.
71 * They are inside the output.path directory.
72 *
73 * See: http://webpack.github.io/docs/configuration.html#output-sourcemapfilename
74 */
75 sourceMapFilename: '[file].map',
80 76
81 publicPath: '/client/' 77 /**
82 }, 78 * The filename of non-entry chunks as relative path
79 * inside the output.path directory.
80 *
81 * See: http://webpack.github.io/docs/configuration.html#output-chunkfilename
82 */
83 chunkFilename: '[name].[chunkhash].chunk.js',
83 84
84 module: { 85 publicPath: '/client/'
85 rules: [ 86 },
86 { 87
87 test: /junk\/index\.js$/, 88 module: {
88 // exclude: /(node_modules|bower_components)/, 89 rules: [
89 use: { 90 {
90 loader: 'babel-loader', 91 test: /junk\/index\.js$/,
91 options: { 92 // exclude: /(node_modules|bower_components)/,
92 presets: [ 'env' ] 93 use: {
94 loader: 'babel-loader',
95 options: {
96 presets: [ 'env' ]
97 }
93 } 98 }
94 } 99 }
95 } 100 ]
96 ] 101 },
97 },
98
99 /**
100 * Add additional plugins to the compiler.
101 *
102 * See: http://webpack.github.io/docs/configuration.html#plugins
103 */
104 plugins: [
105 102
106 /** 103 /**
107 * Webpack plugin to optimize a JavaScript file for faster initial load 104 * Add additional plugins to the compiler.
108 * by wrapping eagerly-invoked functions.
109 * 105 *
110 * See: https://github.com/vigneshshanmugam/optimize-js-plugin 106 * See: http://webpack.github.io/docs/configuration.html#plugins
111 */ 107 */
108 plugins: [
112 109
113 new OptimizeJsPlugin({ 110 /**
114 sourceMap: false 111 * Webpack plugin to optimize a JavaScript file for faster initial load
115 }), 112 * by wrapping eagerly-invoked functions.
113 *
114 * See: https://github.com/vigneshshanmugam/optimize-js-plugin
115 */
116 116
117 /** 117 new OptimizeJsPlugin({
118 * Plugin: DedupePlugin 118 sourceMap: false
119 * Description: Prevents the inclusion of duplicate code into your bundle 119 }),
120 * and instead applies a copy of the function at runtime.
121 *
122 * See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
123 * See: https://github.com/webpack/docs/wiki/optimization#deduplication
124 */
125 // new DedupePlugin(),
126 120
127 /** 121 /**
128 * Plugin: DefinePlugin 122 * Plugin: DedupePlugin
129 * Description: Define free variables. 123 * Description: Prevents the inclusion of duplicate code into your bundle
130 * Useful for having development builds with debug logging or adding global constants. 124 * and instead applies a copy of the function at runtime.
131 * 125 *
132 * Environment helpers 126 * See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
133 * 127 * See: https://github.com/webpack/docs/wiki/optimization#deduplication
134 * See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin 128 */
135 */ 129 // new DedupePlugin(),
136 // NOTE: when adding more properties make sure you include them in custom-typings.d.ts 130
137 new DefinePlugin({ 131 /**
138 'ENV': JSON.stringify(METADATA.ENV), 132 * Plugin: DefinePlugin
139 'HMR': METADATA.HMR, 133 * Description: Define free variables.
140 'API_URL': JSON.stringify(METADATA.API_URL), 134 * Useful for having development builds with debug logging or adding global constants.
141 'process.version': JSON.stringify(process.version), 135 *
142 'process.env': { 136 * Environment helpers
137 *
138 * See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
139 */
140 // NOTE: when adding more properties make sure you include them in custom-typings.d.ts
141 new DefinePlugin({
143 'ENV': JSON.stringify(METADATA.ENV), 142 'ENV': JSON.stringify(METADATA.ENV),
144 'NODE_ENV': JSON.stringify(METADATA.ENV), 143 'HMR': METADATA.HMR,
145 'HMR': METADATA.HMR 144 'API_URL': JSON.stringify(METADATA.API_URL),
146 } 145 'process.version': JSON.stringify(process.version),
147 }), 146 'process.env': {
147 'ENV': JSON.stringify(METADATA.ENV),
148 'NODE_ENV': JSON.stringify(METADATA.ENV),
149 'HMR': METADATA.HMR
150 }
151 }),
148 152
149 /** 153 /**
150 * Plugin: UglifyJsPlugin 154 * Plugin: UglifyJsPlugin
151 * Description: Minimize all JavaScript output of chunks. 155 * Description: Minimize all JavaScript output of chunks.
152 * Loaders are switched into minimizing mode. 156 * Loaders are switched into minimizing mode.
153 * 157 *
154 * See: https://webpack.github.io/docs/list-of-plugins.html#uglifyjsplugin 158 * See: https://webpack.github.io/docs/list-of-plugins.html#uglifyjsplugin
155 */ 159 */
156 // NOTE: To debug prod builds uncomment //debug lines and comment //prod lines 160 // NOTE: To debug prod builds uncomment //debug lines and comment //prod lines
157 new UglifyJsPlugin({ 161 new UglifyJsPlugin({
158 // beautify: true, //debug 162 // beautify: true, //debug
159 // mangle: false, //debug 163 // mangle: false, //debug
160 // dead_code: false, //debug 164 // dead_code: false, //debug
161 // unused: false, //debug 165 // unused: false, //debug
162 // deadCode: false, //debug 166 // deadCode: false, //debug
163 // compress: { 167 // compress: {
164 // screw_ie8: true, 168 // screw_ie8: true,
165 // keep_fnames: true, 169 // keep_fnames: true,
166 // drop_debugger: false, 170 // drop_debugger: false,
167 // dead_code: false, 171 // dead_code: false,
168 // unused: false 172 // unused: false
169 // }, // debug 173 // }, // debug
170 // comments: true, //debug 174 // comments: true, //debug
171 175
172 beautify: false, // prod 176 beautify: false, // prod
173 output: { 177 output: {
174 comments: false 178 comments: false
175 }, // prod 179 }, // prod
176 mangle: { 180 mangle: {
177 screw_ie8: true 181 screw_ie8: true
178 }, // prod 182 }, // prod
179 compress: { 183 compress: {
180 screw_ie8: true, 184 screw_ie8: true,
181 warnings: false, 185 warnings: false,
182 conditionals: true, 186 conditionals: true,
183 unused: true, 187 unused: true,
184 comparisons: true, 188 comparisons: true,
185 sequences: true, 189 sequences: true,
186 dead_code: true, 190 dead_code: true,
187 evaluate: true, 191 evaluate: true,
188 if_return: true, 192 if_return: true,
189 join_vars: true, 193 join_vars: true,
190 negate_iife: false // we need this for lazy v8 194 negate_iife: false // we need this for lazy v8
191 } 195 }
192 }), 196 }),
193 197
194 new NormalModuleReplacementPlugin( 198 new NormalModuleReplacementPlugin(
195 /angular2-hmr/, 199 /angular2-hmr/,
196 helpers.root('config/empty.js') 200 helpers.root('config/empty.js')
197 ), 201 ),
198 202
199 new NormalModuleReplacementPlugin( 203 new NormalModuleReplacementPlugin(
200 /zone\.js(\\|\/)dist(\\|\/)long-stack-trace-zone/, 204 /zone\.js(\\|\/)dist(\\|\/)long-stack-trace-zone/,
201 helpers.root('config/empty.js') 205 helpers.root('config/empty.js')
202 ), 206 ),
203 207
204 new HashedModuleIdsPlugin(), 208 new HashedModuleIdsPlugin(),
205 209
206 /** 210 /**
207 * Plugin: IgnorePlugin 211 * Plugin: IgnorePlugin
208 * Description: Don’t generate modules for requests matching the provided RegExp. 212 * Description: Don’t generate modules for requests matching the provided RegExp.
209 * 213 *
210 * See: http://webpack.github.io/docs/list-of-plugins.html#ignoreplugin 214 * See: http://webpack.github.io/docs/list-of-plugins.html#ignoreplugin
211 */ 215 */
212 216
213 // new IgnorePlugin(/angular2-hmr/), 217 // new IgnorePlugin(/angular2-hmr/),
214 218
215 /** 219 /**
216 * Plugin: CompressionPlugin 220 * Plugin: CompressionPlugin
217 * Description: Prepares compressed versions of assets to serve 221 * Description: Prepares compressed versions of assets to serve
218 * them with Content-Encoding 222 * them with Content-Encoding
219 * 223 *
220 * See: https://github.com/webpack/compression-webpack-plugin 224 * See: https://github.com/webpack/compression-webpack-plugin
221 */ 225 */
222 // install compression-webpack-plugin 226 // install compression-webpack-plugin
223 // new CompressionPlugin({ 227 // new CompressionPlugin({
224 // regExp: /\.css$|\.html$|\.js$|\.map$/, 228 // regExp: /\.css$|\.html$|\.js$|\.map$/,
225 // threshold: 2 * 1024 229 // threshold: 2 * 1024
226 // }) 230 // })
227 231
228 /** 232 /**
229 * Plugin LoaderOptionsPlugin (experimental) 233 * Plugin LoaderOptionsPlugin (experimental)
230 * 234 *
231 * See: https://gist.github.com/sokra/27b24881210b56bbaff7 235 * See: https://gist.github.com/sokra/27b24881210b56bbaff7
232 */ 236 */
233 new LoaderOptionsPlugin({ 237 new LoaderOptionsPlugin({
234 minimize: true, 238 minimize: true,
235 debug: false, 239 debug: false,
236 options: { 240 options: {
237 241
238 /** 242 /**
239 * Static analysis linter for TypeScript advanced options configuration 243 * Static analysis linter for TypeScript advanced options configuration
240 * Description: An extensible linter for the TypeScript language. 244 * Description: An extensible linter for the TypeScript language.
241 * 245 *
242 * See: https://github.com/wbuchwalter/tslint-loader 246 * See: https://github.com/wbuchwalter/tslint-loader
243 */ 247 */
244 tslint: { 248 tslint: {
245 emitErrors: true, 249 emitErrors: true,
246 failOnHint: true, 250 failOnHint: true,
247 resourcePath: 'src' 251 resourcePath: 'src'
248 }, 252 },
249 253
250 /** 254 /**
251 * Html loader advanced options 255 * Html loader advanced options
252 * 256 *
253 * See: https://github.com/webpack/html-loader#advanced-options 257 * See: https://github.com/webpack/html-loader#advanced-options
254 */ 258 */
255 // TODO: Need to workaround Angular 2's html syntax => #id [bind] (event) *ngFor 259 // TODO: Need to workaround Angular 2's html syntax => #id [bind] (event) *ngFor
256 htmlLoader: { 260 htmlLoader: {
257 minimize: true, 261 minimize: true,
258 removeAttributeQuotes: false, 262 removeAttributeQuotes: false,
259 caseSensitive: true, 263 caseSensitive: true,
260 customAttrSurround: [ 264 customAttrSurround: [
261 [/#/, /(?:)/], 265 [/#/, /(?:)/],
262 [/\*/, /(?:)/], 266 [/\*/, /(?:)/],
263 [/\[?\(?/, /(?:)/] 267 [/\[?\(?/, /(?:)/]
264 ], 268 ],
265 customAttrAssign: [/\)?]?=/] 269 customAttrAssign: [/\)?]?=/]
266 }, 270 },
267 271
268 // FIXME: Remove 272 // FIXME: Remove
269 // https://github.com/bholloway/resolve-url-loader/issues/36 273 // https://github.com/bholloway/resolve-url-loader/issues/36
270 // https://github.com/jtangelder/sass-loader/issues/289 274 // https://github.com/jtangelder/sass-loader/issues/289
271 context: __dirname, 275 context: __dirname,
272 output: { 276 output: {
273 path: helpers.root('dist') 277 path: helpers.root('dist')
278 }
274 } 279 }
275 } 280 })
276 }) 281 ],
277 ],
278 282
279 /* 283 /*
280 * Include polyfills or mocks for various node stuff 284 * Include polyfills or mocks for various node stuff
281 * Description: Node configuration 285 * Description: Node configuration
282 * 286 *
283 * See: https://webpack.github.io/docs/configuration.html#node 287 * See: https://webpack.github.io/docs/configuration.html#node
284 */ 288 */
285 node: { 289 node: {
286 global: true, 290 global: true,
287 crypto: 'empty', 291 crypto: 'empty',
288 fs: 'empty', 292 fs: 'empty',
289 process: true, 293 process: true,
290 module: false, 294 module: false,
291 clearImmediate: false, 295 clearImmediate: false,
292 setImmediate: false 296 setImmediate: false
293 } 297 }
294 298
295 }) 299 })
300 ]
296} 301}
diff --git a/client/config/webpack.video-embed.js b/client/config/webpack.video-embed.js
new file mode 100644
index 000000000..a04d5be8b
--- /dev/null
+++ b/client/config/webpack.video-embed.js
@@ -0,0 +1,183 @@
1const helpers = require('./helpers')
2
3const CheckerPlugin = require('awesome-typescript-loader').CheckerPlugin
4const HtmlWebpackPlugin = require('html-webpack-plugin')
5const UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin')
6const HashedModuleIdsPlugin = require('webpack/lib/HashedModuleIdsPlugin')
7const ExtractTextPlugin = require('extract-text-webpack-plugin')
8const PurifyCSSPlugin = require('purifycss-webpack')
9
10module.exports = function (options) {
11 const isProd = options.env === 'production'
12
13 const configuration = {
14 entry: {
15 'video-embed': './src/standalone/videos/embed.ts'
16 },
17
18 resolve: {
19 /*
20 * An array of extensions that should be used to resolve modules.
21 *
22 * See: http://webpack.github.io/docs/configuration.html#resolve-extensions
23 */
24 extensions: [ '.ts', '.js', '.json', '.scss' ],
25
26 modules: [ helpers.root('src'), helpers.root('node_modules') ]
27 },
28
29 output: {
30 path: helpers.root('dist/standalone/videos'),
31 filename: '[name].[hash].bundle.js',
32 sourceMapFilename: '[file].map',
33 chunkFilename: '[id].chunk.js',
34 publicPath: '/client/standalone/videos/'
35 },
36
37 module: {
38
39 rules: [
40 {
41 test: /\.ts$/,
42 use: [
43 {
44 loader: 'awesome-typescript-loader',
45 options: {
46 configFileName: 'tsconfig.webpack.json',
47 useCache: !isProd
48 }
49 }
50 ],
51 exclude: [/\.(spec|e2e)\.ts$/]
52 },
53
54 {
55 test: /\.(sass|scss)$/,
56 use: ExtractTextPlugin.extract({
57 fallback: 'style-loader',
58 use: [
59 {
60 loader: 'css-loader',
61 options: {
62 sourceMap: true,
63 importLoaders: 1
64 }
65 },
66 'resolve-url-loader',
67 {
68 loader: 'sass-loader',
69 options: {
70 sourceMap: true
71 }
72 },
73 {
74 loader: 'sass-resources-loader',
75 options: {
76 resources: [
77 helpers.root('src/sass/_variables.scss')
78 ]
79 }
80 }
81 ]
82 })
83 },
84
85 {
86 test: /\.html$/,
87 use: 'raw-loader',
88 exclude: [
89 helpers.root('src/index.html'),
90 helpers.root('src/standalone/videos/embed.html')
91 ]
92 },
93
94 {
95 test: /\.(jpg|png|gif)$/,
96 use: 'url-loader'
97 },
98
99 { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'url-loader?limit=10000&minetype=application/font-woff' },
100 { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'file-loader' }
101 ]
102
103 },
104
105 plugins: [
106 new ExtractTextPlugin({
107 filename: '[name].[contenthash].css'
108 }),
109
110 new PurifyCSSPlugin({
111 paths: [ helpers.root('src/standalone/videos/embed.ts') ],
112 purifyOptions: {
113 minify: true,
114 whitelist: [ '*vjs*', '*video-js*' ]
115 }
116 }),
117
118 new CheckerPlugin(),
119
120 new HtmlWebpackPlugin({
121 template: 'src/standalone/videos/embed.html',
122 filename: 'embed.html',
123 title: 'PeerTube',
124 chunksSortMode: 'dependency',
125 inject: 'body'
126 })
127 ],
128
129 node: {
130 global: true,
131 crypto: 'empty',
132 fs: 'empty',
133 process: true,
134 module: false,
135 clearImmediate: false,
136 setImmediate: false
137 }
138 }
139
140 if (isProd) {
141 configuration.module.rules.push(
142 {
143 test: /junk\/index\.js$/,
144 // exclude: /(node_modules|bower_components)/,
145 use: {
146 loader: 'babel-loader',
147 options: {
148 presets: [ 'env' ]
149 }
150 }
151 }
152 )
153
154 configuration.plugins.push(
155 new UglifyJsPlugin({
156 beautify: false,
157 output: {
158 comments: false
159 }, // prod
160 mangle: {
161 screw_ie8: true
162 }, // prod
163 compress: {
164 screw_ie8: true,
165 warnings: false,
166 conditionals: true,
167 unused: true,
168 comparisons: true,
169 sequences: true,
170 dead_code: true,
171 evaluate: true,
172 if_return: true,
173 join_vars: true,
174 negate_iife: false // we need this for lazy v8
175 }
176 }),
177
178 new HashedModuleIdsPlugin()
179 )
180 }
181
182 return configuration
183}