X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fwebpack%2Fwebpack.video-embed.js;h=2ecbd09afc1300c2417d3306dec8e5587f83aca8;hb=1d4591fd9c724c9409da31612f6d8c008f1cb5e4;hp=5a4e35deac3e1ce5e9599b7e396e9dc7cce07dc9;hpb=f6a7c82ca51896a433bc2264c52afd6981c7c4c6;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/webpack/webpack.video-embed.js b/client/webpack/webpack.video-embed.js index 5a4e35dea..2ecbd09af 100644 --- a/client/webpack/webpack.video-embed.js +++ b/client/webpack/webpack.video-embed.js @@ -1,19 +1,18 @@ const helpers = require('./helpers') +const path = require('path') -const CheckerPlugin = require('awesome-typescript-loader').CheckerPlugin const HtmlWebpackPlugin = require('html-webpack-plugin') -const UglifyJsPlugin = require('uglifyjs-webpack-plugin') -const HashedModuleIdsPlugin = require('webpack/lib/HashedModuleIdsPlugin') +const TerserPlugin = require('terser-webpack-plugin') const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin') -const ExtractTextPlugin = require('extract-text-webpack-plugin') -const PurifyCSSPlugin = require('purifycss-webpack') +const ProvidePlugin = require('webpack/lib/ProvidePlugin') +const MiniCssExtractPlugin = require('mini-css-extract-plugin') module.exports = function () { - const isProd = process.env.NODE_ENV === 'production' - const configuration = { entry: { - 'video-embed': './src/standalone/videos/embed.ts' + 'video-embed': './src/standalone/videos/embed.ts', + 'player': './src/standalone/player/player.ts', + 'test-embed': './src/standalone/videos/test-embed.ts' }, resolve: { @@ -24,18 +23,43 @@ module.exports = function () { */ extensions: [ '.ts', '.js', '.json', '.scss' ], - modules: [ helpers.root('src'), helpers.root('node_modules') ] + modules: [ helpers.root('src'), 'node_modules' ], + + alias: { + 'video.js$': path.resolve('node_modules/video.js/core.js'), + 'hls.js$': path.resolve('node_modules/hls.js/dist/hls.light.js'), + '@root-helpers': path.resolve('src/root-helpers'), + '@shared/models': path.resolve('../shared/models'), + '@shared/core-utils': path.resolve('../shared/core-utils') + }, + + fallback: { + fs: [ path.resolve('src/shims/noop.ts') ], + http: [ path.resolve('src/shims/http.ts') ], + https: [ path.resolve('src/shims/https.ts') ], + path: [ path.resolve('src/shims/path.ts') ], + stream: [ path.resolve('src/shims/stream.ts') ], + crypto: [ path.resolve('src/shims/noop.ts') ] + } }, output: { path: helpers.root('dist/standalone/videos'), - filename: '[name].[hash].bundle.js', + + filename: process.env.ANALYZE_BUNDLE === 'true' + ? '[name].bundle.js' + : '[name].[contenthash].bundle.js', + sourceMapFilename: '[file].map', - chunkFilename: '[id].chunk.js', + + chunkFilename: process.env.ANALYZE_BUNDLE === 'true' + ? '[name].chunk.js' + : '[id].[contenthash].chunk.js', + publicPath: '/client/standalone/videos/' }, - // devtool: 'source-map', + devtool: process.env.NODE_ENV === 'production' ? false : 'source-map', module: { @@ -44,39 +68,39 @@ module.exports = function () { test: /\.ts$/, use: [ { - loader: 'awesome-typescript-loader', + loader: 'ts-loader', options: { - configFileName: 'tsconfig.json' + configFile: 'tsconfig.json' } } - ], - exclude: [/\.(spec|e2e)\.ts$/] + ] }, { test: /\.(sass|scss)$/, - use: ExtractTextPlugin.extract({ - fallback: 'style-loader', - use: [ - { - loader: 'css-loader', - options: { - sourceMap: true, - importLoaders: 1 - } - }, - 'resolve-url-loader', - { - loader: 'sass-loader', - options: { + use: [ + MiniCssExtractPlugin.loader, + + { + loader: 'css-loader', + options: { + sourceMap: true, + importLoaders: 1 + } + }, + + { + loader: 'sass-loader', + options: { + sassOptions: { sourceMap: true, includePaths: [ helpers.root('src/sass/include') ] } } - ] - }) + } + ] }, { @@ -84,7 +108,8 @@ module.exports = function () { use: 'raw-loader', exclude: [ helpers.root('src/index.html'), - helpers.root('src/standalone/videos/embed.html') + helpers.root('src/standalone/videos/embed.html'), + helpers.root('src/standalone/videos/test-embed.html') ] }, @@ -100,26 +125,41 @@ module.exports = function () { }, plugins: [ - new ExtractTextPlugin({ - filename: '[name].[hash].css' + new ProvidePlugin({ + process: 'process/browser', + Buffer: [ 'buffer', 'Buffer' ] }), - new PurifyCSSPlugin({ - paths: [ helpers.root('src/standalone/videos/embed.ts') ], - purifyOptions: { - minify: true, - whitelist: [ '*vjs*', '*video-js*' ] - } + new MiniCssExtractPlugin({ + filename: process.env.ANALYZE_BUNDLE === 'true' + ? '[name].css' + : '[name].[contenthash].css' }), - new CheckerPlugin(), - new HtmlWebpackPlugin({ template: 'src/standalone/videos/embed.html', filename: 'embed.html', title: 'PeerTube', - chunksSortMode: 'dependency', - inject: 'body' + chunksSortMode: 'auto', + inject: 'body', + chunks: [ 'video-embed' ], + minify: { + collapseWhitespace: true, + removeComments: false, + removeRedundantAttributes: true, + removeScriptTypeAttributes: true, + removeStyleLinkTypeAttributes: true, + useShortDoctype: true + } + }), + + new HtmlWebpackPlugin({ + template: '!!html-loader!src/standalone/videos/test-embed.html', + filename: 'test-embed.html', + title: 'PeerTube', + chunksSortMode: 'auto', + inject: 'body', + chunks: [ 'test-embed' ] }), /** @@ -137,44 +177,36 @@ module.exports = function () { }) ], + optimization: { + minimizer: [ + new TerserPlugin({ + terserOptions: { + ecma: 6, + warnings: false, + ie8: false, + mangle: true, + compress: { + passes: 3, + pure_getters: true + }, + output: { + ascii_only: true, + comments: false + } + } + }) + ] + }, + performance: { maxEntrypointSize: 700000, // 600kB maxAssetSize: 700000 }, node: { - global: true, - crypto: 'empty', - fs: 'empty', - process: true, - module: false, - clearImmediate: false, - setImmediate: false + global: true } } - if (isProd) { - configuration.plugins.push( - new UglifyJsPlugin({ - uglifyOptions: { - ecma: 6, - warnings: false, - ie8: false, - mangle: true, - compress: { - passes: 3, - pure_getters: true - }, - output: { - ascii_only: true, - comments: false - } - } - }), - - new HashedModuleIdsPlugin() - ) - } - return configuration }