• 实战build-react(二)-------引入Ant Design


    安装 Ant Design 
    npm install antd --save
    

      


    yarn add antd
    

      


    注释:https://www.jianshu.com/p/21caf40ee93e(copy)
    然后在开发的过程中,慢慢替换跟舍弃material UI。然而之后的开发,我也发现了Ant Design的弊端,
    那就是组件基本上是完全没有办法自定义样式,基本上所有组件都不接收style参数。想要换个颜色?不行。
    想要改个大小?也不行。
    通过css强制更改,主要是用css中的important强制覆盖掉ant design的样式。我们首先在审核ant组件的元素找到组件的类名,然后在css文件中输入类名,将你需要覆盖的样式用important强制覆盖。同时为了防止强制覆盖样式会引起全局的样式冲突,我们需要给组件的父级一个id,然后css中,组件的类名需要写在父级的id里面,这样样式覆盖只会在你定义的这个父级里面生效。
    //--------------------打断一下--------------------------------------
     作者本人:这是别人文章里看到的,但是本人学习过程中确实看到style可以修改
     
    //----------------------------------------------------------
    但是样式不展示,所以还要引入插件
     
    npm install babel-plugin-import  --save
    

      

    然后在package.json中加入
    "plugins": [
    ["import", {
    "libraryName": "antd",
    "libraryDirectory": "es",
    "style": "css"
    }]
    ]
    

      

    尝试了手动修改package.json,但是不行,
    "dependencies": {
    "antd": "^3.18.1",
    "axios": "^0.18.0",
    "babel-plugin-import": "^1.10.0",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-scripts": "3.0.1",
    "redux": "^4.0.1"
    },
    "devDependencies": {
    "babel-cli": "^6.26.0",
    "json-server": "^0.14.2",
    "mockjs": "^1.0.1-beta3",
    "webpack": "4.29.6"
    },
    

      

    //再尝试正常顺序然后,在手动分dependencies和devDependencies,但不知道对线上是否有影响

    最后网上看到有大神指导,看下一篇文章

     
     
  • 相关阅读:
    mybatis 入门基础
    spring学习总结
    综合练习:词频统计
    组合数据类型综合练习
    Python基础综合练习
    熟悉常用的Linux操作
    1.大数据概述
    C程序语法(无左递归)
    文法规则
    实验一词法分析报告
  • 原文地址:https://www.cnblogs.com/dianzan/p/10876030.html
Copyright © 2020-2023  润新知