webpack从1升级到3的时候,less引入的问题

问题已经解决,由采纳答案者提醒了下,是我大意忘记添加less-loader,添加完毕以后,2个问题均解决。

webpack

{
    test: /\.less$/,
    use: [
      'style-loader',
      {
        loader: 'css-loader',
        options: {
          modules: true,
          sourcemap: true,
          localIdentName: '[name]__[local]___[hash:base64:5]'
        }
      },
      //新增less-loader即可
      {
        loader: "less-loader" 
      },
      {
        loader: 'postcss-loader',
      }
    ],
    include: paths.appSrc
},

配置完以后,less文件中若涉及以下2个问题的时候,会报错:

问题1: 当less里引入路径,是经过webpack resolve过后的,会编译不通过。

test.less

.test{
    background: url(webpackConfigPath/logo.png);
}

webpack

resolve: {
// ...
    alias: {
      'webpackConfigPath': paths.appSrc,
    },
//...
}

问题2:无法使用less里的层叠关系

.a{
    background: red;
    .b{
        font-size: 12px;
    }
}

<p className={style.b}></p> //获取不到样式
阅读 3.3k
1 个回答

less 不是需要 less-loader 吗?

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题