You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

104 lines
2.5 KiB

4 years ago
  1. const Webpack = require("webpack");
  2. const MiniCssExtractPlugin = require("mini-css-extract-plugin");
  3. const { CleanWebpackPlugin } = require("clean-webpack-plugin");
  4. const HtmlWebpackPlugin = require("html-webpack-plugin");
  5. const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
  6. const path = require("path");
  7. const join = (...paths) => path.join(__dirname, ...paths);
  8. module.exports = (env, { mode }) => ({
  9. resolve: {
  10. extensions: [".js", ".css"],
  11. modules: ["assets", "node_modules"],
  12. },
  13. entry: {
  14. main: join("assets", "js", "menu.js"),
  15. languageSelector: join("assets", "js", "languageSelector.js"),
  16. prism: join("assets", "js", "prism.js"),
  17. style: join("assets", "css", "style.css"),
  18. red: join("assets", "css", "color", "red.css"),
  19. blue: join("assets", "css", "color", "blue.css"),
  20. green: join("assets", "css", "color", "green.css"),
  21. pink: join("assets", "css", "color", "pink.css"),
  22. },
  23. output: {
  24. filename: "[name].js",
  25. path: join("static/assets"),
  26. publicPath: "",
  27. },
  28. performance: {
  29. hints: false,
  30. },
  31. module: {
  32. rules: [
  33. {
  34. test: /\.js$/,
  35. exclude: /node_modules/,
  36. use: {
  37. loader: "babel-loader",
  38. options: {
  39. presets: ["@babel/preset-env"],
  40. },
  41. },
  42. },
  43. {
  44. test: /\.(png|jpg|woff|woff2|ttf|eot|svg)$/,
  45. use: [
  46. {
  47. loader: "url-loader",
  48. options: {
  49. limit: 8192,
  50. },
  51. },
  52. ],
  53. },
  54. {
  55. test: /\.css$/,
  56. use: [
  57. MiniCssExtractPlugin.loader,
  58. {
  59. loader: "css-loader",
  60. options: {
  61. modules: {
  62. localIdentName: "[local]",
  63. },
  64. import: true,
  65. importLoaders: 1,
  66. },
  67. },
  68. "postcss-loader",
  69. ],
  70. },
  71. ],
  72. },
  73. optimization: {
  74. splitChunks: {
  75. name: "vendor",
  76. minChunks: 2,
  77. },
  78. minimizer: [
  79. new UglifyJsPlugin({
  80. sourceMap: true,
  81. }),
  82. ],
  83. },
  84. plugins: [
  85. new CleanWebpackPlugin({
  86. cleanOnceBeforeBuildPatterns: [join("static/assets")],
  87. cleanAfterEveryBuildPatterns: [
  88. join("static/assets/style.js"),
  89. join("static/assets/blue.js"),
  90. join("static/assets/green.js"),
  91. join("static/assets/red.js"),
  92. join("static/assets/pink.js"),
  93. ],
  94. verbose: true,
  95. }),
  96. new MiniCssExtractPlugin({
  97. filename: "[name].css",
  98. chunkFilename: "[id].css",
  99. }),
  100. ],
  101. });