zoukankan      html  css  js  c++  java
  • antd----react css框架

    安装  npm install antd --save

    1.安装依赖:npm install react-app-rewired customize-cra babel-plugin-import less less-loader
                2.修改package.json
                        ....
                            "scripts": {
                                "start": "react-app-rewired start",
                                "build": "react-app-rewired build",
                                "test": "react-app-rewired test",
                                "eject": "react-scripts eject"
                            },
                        ....
                3.根目录下创建config-overrides.js
                        //配置具体的修改规则
                        const { override, fixBabelImports,addLessLoader} = require('customize-cra');
                        module.exports = override(
                            fixBabelImports('import', {
                                libraryName: 'antd',
                                libraryDirectory: 'es',
                                style: true,
                            }),
                            addLessLoader({
                                lessOptions:{
                                    javascriptEnabled: true,
                                    modifyVars: { '@primary-color': 'green' },
                                }
                            }),
                        );
                    4.备注:不用在组件里亲自引入样式了,即:import 'antd/dist/antd.css'应该删掉
                     import { Button,DatePicker } from 'antd';
                     import {WechatOutlined,WeiboOutlined,SearchOutlined} from '@ant-design/icons'
                     const { RangePicker } = DatePicker;
  • 相关阅读:
    day3 数据类型
    子查询
    mysql综合练习题
    day5 练习
    月末总结
    Iconfont-阿里巴巴矢量图标库
    vue简介
    Redis简介和数据结构
    浏览器初始化css
    vue脚手架搭建项目初始化
  • 原文地址:https://www.cnblogs.com/sunmarvell/p/14454121.html
Copyright © 2011-2022 走看看