首页 > 其他 > 详细

在React中使用less

时间:2021-06-03 17:08:58      阅读:16      评论:0      收藏:0      [点我收藏+]

1.需要暴露出webpack的配置文件

在中端运行 npm run eject

 

2.安装less和less-loader插件

运行 npm install less-loader less --save

 

3.修改webpack的配置文件

找到config文件夹目录下的webpack.config.js。添加一下代码

const lessRegex = /\.less$/;
const lessModuleRegex = /\.module\.less$/;

  技术分享图片

 

之后在文件中搜素oneof,增加oneof中的配置代码,之后就可以直接使用了

{
  test: lessRegex,
  exclude: lessModuleRegex,
  use: getStyleLoaders(
    {
      importLoaders: 2,
      sourceMap: isEnvProduction && shouldUseSourceMap,
    },
    ‘less-loader‘
  ),
  // Don‘t consider CSS imports dead code even if the
  // containing package claims to have no side effects.
  // Remove this when webpack adds a warning or an error for this.
  // See https://github.com/webpack/webpack/issues/6571
  sideEffects: true,
},
// Adds support for CSS Modules, but using SASS
// using the extension .module.scss or .module.sass
{
  test: lessModuleRegex,
  use: getStyleLoaders(
    {
      importLoaders: 2,
      sourceMap: isEnvProduction && shouldUseSourceMap,
      modules: true,
      getLocalIdent: getCSSModuleLocalIdent,
    },
    ‘less-loader‘
  ),
},

  技术分享图片

 

在React中使用less

原文:https://www.cnblogs.com/sisxxw/p/14845504.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!