less-loader报错描述

按照webpack官方文档less-loader的使用：

webpack.config.js文件：

module.exports = {
  module: {
    rules: [
      {
        test: /\.less$/i,
        loader: [
          // compiles Less to CSS
          'style-loader',
          'css-loader',
          'less-loader',
        ],
      },
    ],
  },
};

产生了一个报错信息(翻译后)： rule[0].loader应该是一个非空字符串。 ->加载器请求。

原因

webpack官方文档在编写存在小问题，因为loader:只能识别一个loader，报错提示rule.loader应该是一个非空字符串，而不应该是一个数组。

解决方法：

把loader换成use，代码如下：

rules: [
      {
        test: /\.less$/i,
        use: [
          'style-loader',
          'css-loader',
          'less-loader',
        ],
      },
    ],