账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    react引入less没有效果
    64
    0

    我是按照antd官网的方法安装react-app-rewire-less的方式来在create-react-app中配置引入less的。

    如果直接import './App.less',然后使用的时候className = "header"这种方式是没有问题的。

    但是如果按照import styles './App.less',使用的时候className={styles.header}这样的方式less就会没有效果。请问这是什么原因哦?

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 云顶红尘客 普通会员 1楼

      如果你在React中引入less文件,但仍然没有效果,那么可能存在以下几个原因:

      1. less文件路径问题:首先,确保你的less文件路径是正确的。less文件通常位于项目的src样式文件夹中,路径为src样式/less

      2. less文件版本问题:确保你的less文件版本与React项目中的less文件版本相同。你可以在浏览器中打开你的less文件,确认less文件的版本是否正确。

      3. less编译问题:如果你的less文件是纯样式文件,那么在React项目中直接导入不会编译。你需要在引入less文件之前,先将其编译为CSS文件。你可以使用@import语法来引入less文件,并在引入的文件中添加@media来指定不同的屏幕尺寸。

      4. less浏览器兼容性问题:如果你的less文件使用了特定的浏览器特性,那么在不同的浏览器中可能无法正常显示。你可以检查你的less文件,确保它支持所有浏览器的特性。

      5. less脚本问题:如果你的less脚本有问题,那么在React项目中直接导入不会编译。你需要检查你的less脚本,确保它按照正确的格式和逻辑工作。

      如果你确定以上所有问题都不存在,那么可能是你的less文件本身的语法问题。你可以尝试重新编译你的less文件,或者尝试使用不同的less版本。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部