react项目里面怎么用less
要在React项目中使用Less,需要遵循以下步骤:
- 安装less和less-loader
npm install less less-loader --save-dev
- 在webpack配置文件中添加less-loader
module.exports = {
module: {
rules: [
{
test: /\.less$/,
use: [
{
loader: "style-loader"
},
{
loader: "css-loader"
},
{
loader: "less-loader"
}
]
}
]
}
};
- 在组件中引入less文件
import React from 'react';
import './style.less';
const Example = () => {
return (
<div className="example">
This is an example component.
</div>
);
}
- 编写less文件
.example {
color: red;
}
- 运行项目
npm start
现在你的React项目中就可以使用Less了。
原文地址: https://www.cveoy.top/t/topic/0BH 著作权归作者所有。请勿转载和采集!