client/webpack/webpack.video-embed.js

   1 const helpers = require('./helpers')
   2 const path = require('path')
   3
   4 const HtmlWebpackPlugin = require('html-webpack-plugin')
   5 const TerserPlugin = require('terser-webpack-plugin')
   6 const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin')
   7 const MiniCssExtractPlugin = require('mini-css-extract-plugin')
   8
   9 module.exports = function () {
  10   const configuration = {
  11     entry: {
  12       'video-embed': './src/standalone/videos/embed.ts',
  13       'player': './src/standalone/player/player.ts',
  14       'test-embed': './src/standalone/videos/test-embed.ts'
  15     },
  16
  17     resolve: {
  18       /*
  19        * An array of extensions that should be used to resolve modules.
  20        *
  21        * See: http://webpack.github.io/docs/configuration.html#resolve-extensions
  22        */
  23       extensions: [ '.ts', '.js', '.json', '.scss' ],
  24
  25       modules: [ helpers.root('src'), 'node_modules' ],
  26
  27       alias: {
  28         'video.js$': path.resolve('node_modules/video.js/core.js'),
  29         '@root-helpers': path.resolve('src/root-helpers'),
  30         '@shared/models': path.resolve('../shared/models'),
  31         '@shared/core-utils': path.resolve('../shared/core-utils')
  32       }
  33     },
  34
  35     output: {
  36       path: helpers.root('dist/standalone/videos'),
  37
  38       filename: process.env.ANALYZE_BUNDLE === 'true'
  39         ? '[name].bundle.js'
  40         : '[name].[hash].bundle.js',
  41
  42       sourceMapFilename: '[file].map',
  43
  44       chunkFilename: process.env.ANALYZE_BUNDLE === 'true'
  45         ? '[name].chunk.js'
  46         : '[id].[hash].chunk.js',
  47
  48       publicPath: '/client/standalone/videos/'
  49     },
  50
  51     devtool: process.env.NODE_ENV === 'production' ? false : 'source-map',
  52
  53     module: {
  54
  55       rules: [
  56         {
  57           test: /\.ts$/,
  58           use: [
  59             {
  60               loader: 'ts-loader',
  61               options: {
  62                 configFile: 'tsconfig.base.json'
  63               }
  64             }
  65           ]
  66         },
  67
  68         {
  69           test: /\.(sass|scss)$/,
  70           use: [
  71             MiniCssExtractPlugin.loader,
  72
  73             {
  74               loader: 'css-loader',
  75               options: {
  76                 sourceMap: true,
  77                 importLoaders: 1
  78               }
  79             },
  80
  81             {
  82               loader: 'sass-loader',
  83               options: {
  84                 sassOptions: {
  85                   sourceMap: true,
  86                   includePaths: [
  87                     helpers.root('src/sass/include')
  88                   ]
  89                 }
  90               }
  91             }
  92           ]
  93         },
  94
  95         {
  96           test: /\.html$/,
  97           use: 'raw-loader',
  98           exclude: [
  99             helpers.root('src/index.html'),
 100             helpers.root('src/standalone/videos/embed.html'),
 101             helpers.root('src/standalone/videos/test-embed.html')
 102           ]
 103         },
 104
 105         {
 106           test: /\.(jpg|png|gif)$/,
 107           use: 'url-loader'
 108         },
 109
 110         { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'url-loader?limit=10000&minetype=application/font-woff' },
 111         { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'file-loader' }
 112       ]
 113
 114     },
 115
 116     plugins: [
 117       new MiniCssExtractPlugin({
 118         filename: process.env.ANALYZE_BUNDLE === 'true'
 119           ? '[name].css'
 120           : '[name].[hash].css'
 121       }),
 122
 123       new HtmlWebpackPlugin({
 124         template: 'src/standalone/videos/embed.html',
 125         filename: 'embed.html',
 126         title: 'PeerTube',
 127         chunksSortMode: 'auto',
 128         inject: 'body',
 129         chunks: ['video-embed'],
 130         minify: {
 131           collapseWhitespace: true,
 132           removeComments: false,
 133           removeRedundantAttributes: true,
 134           removeScriptTypeAttributes: true,
 135           removeStyleLinkTypeAttributes: true,
 136           useShortDoctype: true
 137         }
 138       }),
 139
 140       new HtmlWebpackPlugin({
 141         template: '!!html-loader!src/standalone/videos/test-embed.html',
 142         filename: 'test-embed.html',
 143         title: 'PeerTube',
 144         chunksSortMode: 'auto',
 145         inject: 'body',
 146         chunks: ['test-embed']
 147       }),
 148
 149       /**
 150        * Plugin LoaderOptionsPlugin (experimental)
 151        *
 152        * See: https://gist.github.com/sokra/27b24881210b56bbaff7
 153        */
 154       new LoaderOptionsPlugin({
 155         options: {
 156           context: __dirname,
 157           output: {
 158             path: helpers.root('dist')
 159           }
 160         }
 161       })
 162     ],
 163
 164     optimization: {
 165       minimizer: [
 166         new TerserPlugin({
 167           terserOptions: {
 168             ecma: 6,
 169             warnings: false,
 170             ie8: false,
 171             mangle: true,
 172             compress: {
 173               passes: 3,
 174               pure_getters: true
 175             },
 176             output: {
 177               ascii_only: true,
 178               comments: false
 179             }
 180           }
 181         })
 182       ]
 183     },
 184
 185     performance: {
 186       maxEntrypointSize: 700000, // 600kB
 187       maxAssetSize: 700000
 188     },
 189
 190     node: {
 191       global: true,
 192       crypto: 'empty',
 193       fs: 'empty',
 194       process: true,
 195       module: false,
 196       clearImmediate: false,
 197       setImmediate: false
 198     }
 199   }
 200
 201   return configuration
 202 }