1. const { resolve } = require('path');
    2. // 复用loader
    3. const commonCssLoader = [
    4. MiniCssExtractPlugin.loader,
    5. 'css-loader',
    6. {
    7. // 还需要在package.json中定义browserslist
    8. loader: 'postcss-loader',
    9. options: {
    10. ident: 'postcss',
    11. plugins: () => [require('postcss-preset-env')()]
    12. }
    13. }
    14. ];
    15. module.exports = {
    16. entry: './src/js/index.js',
    17. output: {
    18. filename: 'js/built.js',
    19. path: resolve(__dirname, 'build')
    20. },
    21. module: {
    22. rules: [
    23. {
    24. // 以下loader只会匹配一个
    25. // 注意:不能有两个配置处理同一种类型文件
    26. oneOf: [
    27. {
    28. test: /\.css$/,
    29. use: [...commonCssLoader]
    30. },
    31. {
    32. test: /\.less$/,
    33. use: [...commonCssLoader, 'less-loader']
    34. },
    35. {
    36. test: /\.html$/,
    37. loader: 'html-loader'
    38. },
    39. ]
    40. }
    41. ]
    42. },
    43. plugins: [],
    44. mode: 'production'
    45. };