我如何获得mini-css-extract-plugin来缩小我的文件

时间:2018-11-03 15:59:57

标签: reactjs webpack mini-css-extract-plugin

获取在dist文件夹中生成的bundle.css,但没有缩小。我正在将它们手动加载到我的html文件中,如下所示:<link rel="stylesheet" href="../static/dist/bundle.css">。同样将样式文件导入index.js中,例如:import "../css/style.css";。我该如何缩小尺寸?

const MiniCssExtractPlugin = require("mini-css-extract-plugin");




module.exports = {
  mode: "development",
  entry: ["./static/js/index.js"],
  output: {
    path: path.resolve(__dirname, "static/dist"), 
    filename: "bundle.js"
  },
  watch: true,
  module: {
    rules: [
      {
        test: /\.m?js$/,
        exclude: /(node_modules|bower_components)/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['@babel/preset-env', "@babel/preset-react"],
            plugins: [
              ['@babel/plugin-proposal-object-rest-spread'],
              ['@babel/plugin-proposal-class-properties']
            ]
          }
        }
      },
      {
        test: /\.css$/,
        use: [
        {
          loader: MiniCssExtractPlugin.loader,
        },
        'css-loader' 
        ]
      }
    ]
  },
   plugins: [
    new MiniCssExtractPlugin({
      filename: "./bundle.css",
    }),
  ]
} 

0 个答案:

没有答案