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'), helpers.root('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       chunkFilename: '[id].[hash].chunk.js',
  44       publicPath: '/client/standalone/videos/'
  45     },
  46
  47     devtool: process.env.NODE_ENV === 'production' ? false : 'source-map',
  48
  49     module: {
  50
  51       rules: [
  52         {
  53           test: /\.ts$/,
  54           use: [
  55             {
  56               loader: 'ts-loader',
  57               options: {
  58                 configFile: 'tsconfig.base.json'
  59               }
  60             }
  61           ]
  62         },
  63
  64         {
  65           test: /\.(sass|scss)$/,
  66           use: [
  67             MiniCssExtractPlugin.loader,
  68
  69             {
  70               loader: 'css-loader',
  71               options: {
  72                 sourceMap: true,
  73                 importLoaders: 1
  74               }
  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           test: /\.html$/,
  93           use: 'raw-loader',
  94           exclude: [
  95             helpers.root('src/index.html'),
  96             helpers.root('src/standalone/videos/embed.html'),
  97             helpers.root('src/standalone/videos/test-embed.html')
  98           ]
  99         },
 100
 101         {
 102           test: /\.(jpg|png|gif)$/,
 103           use: 'url-loader'
 104         },
 105
 106         { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'url-loader?limit=10000&minetype=application/font-woff' },
 107         { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, use: 'file-loader' }
 108       ]
 109
 110     },
 111
 112     plugins: [
 113       new MiniCssExtractPlugin({
 114         filename: process.env.ANALYZE_BUNDLE === 'true'
 115           ? '[name].css'
 116           : '[name].[hash].css'
 117       }),
 118
 119       new HtmlWebpackPlugin({
 120         template: 'src/standalone/videos/embed.html',
 121         filename: 'embed.html',
 122         title: 'PeerTube',
 123         chunksSortMode: 'auto',
 124         inject: 'body',
 125         chunks: ['video-embed'],
 126         minify: {
 127           collapseWhitespace: true,
 128           removeComments: false,
 129           removeRedundantAttributes: true,
 130           removeScriptTypeAttributes: true,
 131           removeStyleLinkTypeAttributes: true,
 132           useShortDoctype: true
 133         }
 134       }),
 135
 136       new HtmlWebpackPlugin({
 137         template: '!!html-loader!src/standalone/videos/test-embed.html',
 138         filename: 'test-embed.html',
 139         title: 'PeerTube',
 140         chunksSortMode: 'auto',
 141         inject: 'body',
 142         chunks: ['test-embed']
 143       }),
 144
 145       /**
 146        * Plugin LoaderOptionsPlugin (experimental)
 147        *
 148        * See: https://gist.github.com/sokra/27b24881210b56bbaff7
 149        */
 150       new LoaderOptionsPlugin({
 151         options: {
 152           context: __dirname,
 153           output: {
 154             path: helpers.root('dist')
 155           }
 156         }
 157       })
 158     ],
 159
 160     optimization: {
 161       minimizer: [
 162         new TerserPlugin({
 163           terserOptions: {
 164             ecma: 6,
 165             warnings: false,
 166             ie8: false,
 167             mangle: true,
 168             compress: {
 169               passes: 3,
 170               pure_getters: true
 171             },
 172             output: {
 173               ascii_only: true,
 174               comments: false
 175             }
 176           }
 177         })
 178       ]
 179     },
 180
 181     performance: {
 182       maxEntrypointSize: 700000, // 600kB
 183       maxAssetSize: 700000
 184     },
 185
 186     node: {
 187       global: true,
 188       crypto: 'empty',
 189       fs: 'empty',
 190       process: true,
 191       module: false,
 192       clearImmediate: false,
 193       setImmediate: false
 194     }
 195   }
 196
 197   return configuration
 198 }