zoukankan      html  css  js  c++  java
  • 【React】dva-cli建立脚手架后发现页面样式不对的问题

    用dva-cli作为脚手架建立工程后,开始尝试编写页面。然后立马发现一个坑爹的问题。

    在我less文件里面写了一个class ,比如:MainHead。

    但是编译出来之后发现css文件里面变成了 MainHead__xuaz,多了一个后缀,坑爹嘛这是!!!

    一番查找后发现原来是引用了css-modules这个包。

    为了卸载这个包,我翻找了半天。照例来说应该在webpack的时候屏蔽这个包。

    可惜node项目不知道说封装了太好了还是怎么的,dva生成的脚手架里面根本就没有webpack.config.js这个包。

    终于,在我的不懈努力下终于发现问题的主因了。

    原因就在于dva是用一个叫rodhog的工具打包的。

    在root目录下,有一个叫.roadhogrc的配置文件。

    打开这个文件,里面有一个【disableCSSModules】的配置项。默认是false,启动css-modules,只要将它改成true,就可以屏蔽掉css-modules了。

    -----------------------------------------------------------------一年后的分割线--------------------------------------------------------------------------------------------------

    因为项目时间关系,转而使用相对简单易懂的Vue来开发项目。

    吭哧吭哧整了一年终于将项目完结,重新拾起React后,发现自己犯了一个很基础的错误。

    react里使用css-modules是正确的。目的是防止组件间的css名称污染。

    而react中调用less中的class时,应该使用className,这样编译的时候能保证组件中的class名和less中的class名保持一致。

    如此粗浅而深刻的教训实在是令人惭愧。同时也证明入门的时候要找本好的入门教程,先看书再看代码,好过直接上手代码。

  • 相关阅读:
    数据结构-连续子数组的最大和
    数据结构-并查集
    nginx开启代理后,出现net::ERR_CONTENT_LENGTH_MISMATCH 200 (OK)错误
    计算出n阶乘中尾部零的个数
    常见的加密方式总结
    idea中lombok不生效
    纯真ip地址数据库使用
    go mod使用
    exec: "gcc": executable file not found in %PATH%解决办法
    java多线程系列1-初识多线程多线程4种实现方式
  • 原文地址:https://www.cnblogs.com/nonkicat/p/6253814.html
Copyright © 2011-2022 走看看