webpack 中 less 热加载

2017-09-06 10:30:17 +08:00
 yantianqi

在 vue 文件中的

<style lang="less">
//这里写 css 热加载后样式不对,应该是没有编译,只有刷新后样式才会正确
</style>

配置了 webpack

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

在 vue-loader 中配置 options 还是不行?

options: {
  loaders: {
    less: {
      use: ['style-loader', 'css-loader', 'less-loader']
    }
  }
}

应该怎么配置呢?

2428 次点击
所在节点    程序员
2 条回复
Eoss
2017-09-06 11:39:59 +08:00
```
options: {
loaders: {
less: 'style-loader!css-loader!less-loader'
}
}
```
https://vue-loader.vuejs.org/zh-cn/configurations/pre-processors.html
hevi
2017-09-06 18:11:18 +08:00
https://doc.webpack-china.org/loaders/less-loader

//修改 webpack 配置文件
// webpack.config.js
module.exports = {
...
module: {
rules: [{
test: /\.less$/,
use: [{
loader: "style-loader" // creates style nodes from JS strings
}, {
loader: "css-loader" // translates CSS into CommonJS
}, {
loader: "less-loader" // compiles Less to CSS
}]
}]
}
};

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/388533

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX