• 请不要在回答技术问题时复制粘贴 AI 生成的内容
yantianqi
V2EX  ›  程序员

webpack 中 less 热加载

  •  
  •   yantianqi · Sep 6, 2017 · 2835 views
    This topic created in 3177 days ago, the information mentioned may be changed or developed.

    在 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']
        }
      }
    }
    

    应该怎么配置呢?

    2 replies    2017-09-06 18:11:18 +08:00
    Eoss
        1
    Eoss  
       Sep 6, 2017
    ```
    options: {
    loaders: {
    less: 'style-loader!css-loader!less-loader'
    }
    }
    ```
    https://vue-loader.vuejs.org/zh-cn/configurations/pre-processors.html
    hevi
        2
    hevi  
       Sep 6, 2017
    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
    }]
    }]
    }
    };
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   5594 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 65ms · UTC 06:05 · PVG 14:05 · LAX 23:05 · JFK 02:05
    ♥ Do have faith in what you're doing.