webpack.config.js

   1 const path = require('path');
   2 const glob = require('glob');
   3
   4 // Minify JS
   5 const TerserPlugin = require('terser-webpack-plugin');
   6
   7 // This plugin extracts the CSS into its own file instead of tying it with the JS.
   8 // It prevents:
   9 //   - not having styles due to a JS error
  10 //   - the flash page without styles during JS loading
  11 const MiniCssExtractPlugin = require("mini-css-extract-plugin");
  12
  13 const extractCss = new MiniCssExtractPlugin({
  14   filename: "../css/[name].min.css",
  15 });
  16
  17 module.exports = [
  18   {
  19     mode: 'production',
  20     entry: {
  21       shaare_batch: './assets/common/js/shaare-batch.js',
  22       thumbnails: './assets/common/js/thumbnails.js',
  23       thumbnails_update: './assets/common/js/thumbnails-update.js',
  24       metadata: './assets/common/js/metadata.js',
  25       pluginsadmin: './assets/default/js/plugins-admin.js',
  26       shaarli: [
  27         './assets/default/js/base.js',
  28         './assets/default/scss/shaarli.scss',
  29       ].concat(glob.sync('./assets/default/img/*')),
  30       markdown: './assets/common/css/markdown.css',
  31     },
  32     output: {
  33       filename: '[name].min.js',
  34       path: path.resolve(__dirname, 'tpl/default/js/')
  35     },
  36     module: {
  37       rules: [
  38         {
  39           test: /\.js$/,
  40           exclude: /node_modules/,
  41           use: {
  42             loader: 'babel-loader',
  43             options: {
  44               presets: [
  45                 '@babel/preset-env',
  46               ]
  47             }
  48           }
  49         },
  50         {
  51           test: /\.s?css/,
  52           use: [
  53             {
  54               loader: MiniCssExtractPlugin.loader,
  55               options: {
  56                 publicPath: 'tpl/default/css/',
  57               },
  58             },
  59             'css-loader',
  60             'sass-loader',
  61           ],
  62         },
  63         {
  64           test: /\.(gif|png|jpe?g|svg|ico)$/i,
  65           use: [
  66             {
  67               loader: 'file-loader',
  68               options: {
  69                 name: '../img/[name].[ext]',
  70                 publicPath: 'tpl/default/img/',
  71               }
  72             }
  73           ],
  74         },
  75         {
  76           test: /\.(eot|ttf|woff|woff2)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
  77           loader: 'file-loader',
  78           options: {
  79             name: '../fonts/[name].[ext]',
  80             // do not add a publicPath here because it's already handled by CSS's publicPath
  81             publicPath: '../default/',
  82           }
  83         },
  84       ],
  85     },
  86     optimization: {
  87       minimize: true,
  88       minimizer: [new TerserPlugin()],
  89     },
  90     plugins: [
  91       extractCss,
  92     ],
  93   },
  94   {
  95     mode: 'production',
  96     entry: {
  97       shaarli: [
  98         './assets/vintage/js/base.js',
  99         './assets/vintage/css/reset.css',
 100         './assets/vintage/css/shaarli.css',
 101       ].concat(glob.sync('./assets/vintage/img/*')),
 102       markdown: './assets/common/css/markdown.css',
 103       thumbnails: './assets/common/js/thumbnails.js',
 104       metadata: './assets/common/js/metadata.js',
 105       thumbnails_update: './assets/common/js/thumbnails-update.js',
 106     },
 107     output: {
 108       filename: '[name].min.js',
 109       path: path.resolve(__dirname, 'tpl/vintage/js/')
 110     },
 111     module: {
 112       rules: [
 113         {
 114           test: /\.js$/,
 115           exclude: /node_modules/,
 116           use: {
 117             loader: 'babel-loader',
 118             options: {
 119               presets: [
 120                 '@babel/preset-env',
 121               ]
 122             }
 123           }
 124         },
 125         {
 126           test: /\.css$/,
 127           use: [
 128             {
 129               loader: MiniCssExtractPlugin.loader,
 130               options: {
 131                 publicPath: 'tpl/vintage/css/',
 132               },
 133             },
 134             'css-loader',
 135             'sass-loader',
 136           ],
 137         },
 138         {
 139           test: /\.(gif|png|jpe?g|svg|ico)$/i,
 140           use: [
 141             {
 142               loader: 'file-loader',
 143               options: {
 144                 name: '../img/[name].[ext]',
 145                 publicPath: '',
 146               }
 147             }
 148           ],
 149         },
 150       ],
 151     },
 152     optimization: {
 153       minimize: true,
 154       minimizer: [new TerserPlugin()],
 155     },
 156     plugins: [
 157       extractCss,
 158     ],
 159   },
 160 ];