ToDoPattern/webpack.config.js at master · MatheusPalinkas/ToDoPattern · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const optimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");

const plugins = [
  new HtmlWebpackPlugin({
    minify: {
      html5: true,
      collapseWhitespace: true,
      removeComments: true,
    },
    hash: true,
    template: "./index.html",
    filename: "index.html",
  }),
  new MiniCssExtractPlugin({
    filename: "styles.css",
    chunkFilename: "[id].css",
  }),
  new optimizeCSSAssetsPlugin({
    cssProcessor: require("cssnano"),
    cssProcessorOptions: {
      discardComments: {
        removeAll: true,
      },
    },
    canPrint: true,
  }),
];

const rules = [
  {
    test: /\.css$/,
    use: [
      {
        loader: MiniCssExtractPlugin.loader,
        options: {
          publicPath: "/public/path/to/",
        },
      },
      "css-loader",
    ],
  },
  {
    test: /\.html$/,
    use: ["html-loader"],
  },
  {
    test: /\.png$/,
    use: {
      loader: "file-loader",
      options: {
        name: "[path][name].[ext]",
      },
    },
  },
  {
    use: /\.js$/,
    exclude: /(node_modules|.(|png|css))/,
    use: {
      loader: "babel-loader",
    },
  },
];

module.exports = {
  entry: "./js/boot.js",
  output: {
    filename: "bundle.js",
    path: path.resolve(__dirname, "dist"),
  },
  devServer: {
    open: true,
    contentBase: "dist",
  },
  plugins,
  module: {
    rules,
  },
};