webpack中webpack.config.js中 less的配置方式两种方式的不同?

Question

{

    test: /\.less$/,
    loader: "style-loader!css-loader!less-loader",

}

1上面是loader 下面是use 他们的区别是啥呢

test里面也不一样 /.(less|css)$/, 和 /\.less$/,

{

    test: /\.(less|css)$/,
    use:[ 'style-loader','css-loader','less-loader'],

}

---

Answer 1

如果稍微入门的学习一下webpack 这个就不是个问题了，我也是刚刚才了解到这个方面的东西。
通常的webpack用法是use:[ 'style-loader','css-loader','less-loader'],
但是，其实loader可以理解为是个简写，但是其实loader可以作为use里面的参数进行多点配置!

test: /\.css$/,
    use: [
      'style-loader',
      {
        loader: 'css-loader',
        options: { root: '.' }
      }
    ]

要是想要彻底弄懂这类问题可以学习一下webpack，这类算是webpack入门累的问题了!
http://www.css88.com/doc/webp...

希望，我的回答能帮到你！

Answer 2

RTFM

---

https://webpack.js.org/config...
https://webpack.js.org/config...

Answer 3

test不同：

• 前者只对 less 后缀的文件应用相应 loader 处理。
• 后者对 less和css 后缀的文件应用相应 loader 处理。

loader/use 不同：
webpack 不同版本写法不同而已。现在的新版本一般都是 use 写法。