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 ExtractTextPlugin = require('extract-text-webpack-plugin')
   8 const PurifyCSSPlugin = require('purifycss-webpack')
   9
  10 module.exports = function () {
  11   const configuration = {
  12     entry: {
  13       'video-embed': './src/standalone/videos/embed.ts',
  14       'player': './src/standalone/player/player.ts',
  15       'test-embed': './src/standalone/videos/test-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       alias: {
  29         'video.js$': path.resolve('node_modules/video.js/core.js'),
  30         '@root-helpers': path.resolve('src/root-helpers'),
  31         '@shared/models': path.resolve('../shared/models'),
  32         '@shared/core-utils': path.resolve('../shared/core-utils')
  33       }
  34     },
  35
  36     output: {
  37       path: helpers.root('dist/standalone/videos'),
  38
  39       filename: process.env.ANALYZE_BUNDLE === 'true'
  40         ? '[name].bundle.js'
  41         : '[name].[hash].bundle.js',
  42
  43       sourceMapFilename: '[file].map',
  44       chunkFilename: '[id].[hash].chunk.js',
  45       publicPath: '/client/standalone/videos/'
  46     },
  47
  48     devtool: process.env.NODE_ENV === 'production' ? false : 'source-map',
  49
  50     module: {
  51
  52       rules: [
  53         {
  54           test: /\.ts$/,
  55           use: [
  56             {
  57               loader: 'ts-loader',
  58               options: {
  59                 configFile: 'tsconfig.base.json'
  60               }
  61             }
  62           ]
  63         },
  64
  65         {
  66           test: /\.(sass|scss)$/,
  67           use: ExtractTextPlugin.extract({
  68             fallback: 'style-loader',
  69             use: [
  70               {
  71                 loader: 'css-loader',
  72                 options: {
  73                   sourceMap: true,
  74                   importLoaders: 1
  75                 }
  76               },
  77               {
  78                 loader: 'sass-loader',
  79                 options: {
  80                   sassOptions: {
  81                     sourceMap: true,
  82                     includePaths: [
  83                       helpers.root('src/sass/include')
  84                     ]
  85                   }
  86                 }
  87               }
  88             ]
  89           })
  90         },
  91
  92         {
  93           test: /\.html$/,
  94           use: 'raw-loader',
  95           exclude: [
  96             helpers.root('src/index.html'),
  97             helpers.root('src/standalone/videos/embed.html'),
  98             helpers.root('src/standalone/videos/test-embed.html')
  99           ]
 100         },
 101
 102         {
 103           test: /\.(jpg|png|gif)$/,
 104           use: 'url-loader'
 105         },
 106
 107         { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'url-loader?limit=10000&minetype=application/font-woff' },
 108         { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'file-loader' }
 109       ]
 110
 111     },
 112
 113     plugins: [
 114       new ExtractTextPlugin({
 115         filename: process.env.ANALYZE_BUNDLE === 'true'
 116           ? '[name].css'
 117           : '[name].[hash].css'
 118       }),
 119
 120       new PurifyCSSPlugin({
 121         paths: [
 122           helpers.root('src/standalone/videos/embed.ts'),
 123           helpers.root('src/standalone/videos/test-embed.html')
 124         ],
 125         purifyOptions: {
 126           minify: true,
 127           whitelist: [ '*vjs*', '*video-js*' ]
 128         }
 129       }),
 130
 131       new HtmlWebpackPlugin({
 132         template: 'src/standalone/videos/embed.html',
 133         filename: 'embed.html',
 134         title: 'PeerTube',
 135         chunksSortMode: 'auto',
 136         inject: 'body',
 137         chunks: ['video-embed']
 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 }