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