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