将Webpack 4 MiniCssExtractPlugin的CSS降至

时间:2018-09-03 15:56:31

标签: css less webpack-4

我尝试找到通过webpack 4少编译到css的最佳方法。

以下是我当前的工作版本。

我的项目结构:

(source path)
-  source/
   -  styles/
      -  common.less
   -  scripts/
      -  index.js (here import '../styles/common.less')
      -  test.js

(public path)
-  src/
   -  css/
      -  common.css
   -  js/
      -  index.js
      -  test.js

这是我的webpack.config.js

const webpack = require('webpack');
const path = require('path');
const entryPath = path.resolve(__dirname, 'Source/Scripts/');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");

module.exports = {
    entry: {
        index: entryPath + '/index.js',
        test: entryPath + '/test.js'
    },
    output: {
        path: path.resolve(__dirname, 'src/js'),
        filename: '[name].js'
    },
    module: {
        rules: [
            {
                test: /\.less$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    "css-loader",
                    "less-loader"
                ]
              }
        ]
    },
    plugins: [

        new MiniCssExtractPlugin({
            filename: "../css/[name].css"
          })
    ]
};  

我需要下一步的建议:

  1. 请勿在{{1​​}}中使用import '../styles/common.less。我想要 使index.jscommon.less
  2. 请勿使用这个奇怪的名称: entry point

0 个答案:

没有答案