webpack.config.prod.js 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. const path = require('path')
  2. const MiniCssExtractPlugin = require('mini-css-extract-plugin')
  3. const HtmlWebpackPlugin = require('html-webpack-plugin')
  4. const projectPath = path.resolve(__dirname, '../')
  5. module.exports = {
  6. mode: 'production',
  7. entry: './src/index.js',
  8. output: {
  9. path: path.resolve(__dirname, '../dist'),
  10. filename: '[name]-bundle-[hash:8].js',
  11. },
  12. module: {
  13. rules: [
  14. {
  15. test: /\.js$/,
  16. loader: 'babel-loader',
  17. include: path.resolve(projectPath, 'src'),
  18. exclude: /node_modules/,
  19. },
  20. {
  21. test: /\.css$/,
  22. use: [
  23. {
  24. loader: MiniCssExtractPlugin.loader,
  25. options: {
  26. publicPath: '../dist/styles',
  27. },
  28. },
  29. {
  30. loader: 'css-loader',
  31. options: {
  32. modules: true,
  33. camelCase: true,
  34. localIdentName: '[name]__[local]--[hash:base64:5]',
  35. },
  36. },
  37. ],
  38. },
  39. ],
  40. },
  41. plugins: [
  42. new MiniCssExtractPlugin({
  43. filename: '[name].css',
  44. chunkFilename: '[id].css',
  45. }),
  46. new HtmlWebpackPlugin({
  47. title: 'Datepicker',
  48. filename: 'index.html',
  49. template: path.resolve(projectPath, 'index.html'),
  50. inject: false,
  51. }),
  52. ],
  53. }