1,关于样式less
- 安装下载less和less-loader
npm install less less-loader --save-dev
在引用less时不能用的解决方法
- 在config文件中打开webpack.config.js,然后Ctrl+F全局搜索sass,将相关的sass改成less即可
- 在改完配置文件后要重新启动
npm run start
2,样式作用域问题
因为在项目中默认引入的文件是全局,容易造成类名重复,混乱,主要解决方法是:
-
保证类名不重复,采用BEN命名法,例:btn-error-small
-
样式模块化
正常情况下引用样式是:
import './index.less'
模块化引用:
import {style} from './index.module.less'
在标签中的用法:
<div className={style.box}></div>//box是起的class类名