React降级配置及Ant Design配置

栏目: 前端 · 发布时间: 5年前

内容简介:可以看到当前的react-scripts是2.1.2版本,且只兼容IE11以上,所以为了更好地兼容IE浏览器,我们需要做降级配置3.进入目录,在master分支下进行配置(如果创建好的目录中没有.git文件,使用git init初始化目录)之所以要在master分支下进行配置,是为了在下文中运行 npm run eject

1.使用create-react-app创建一个目录

React降级配置及Ant Design配置

2.查看当前目录下的package.json文件中的配置

React降级配置及Ant Design配置

注意:

可以看到当前的react-scripts是2.1.2版本,且只兼容IE11以上,所以为了更好地兼容IE浏览器,我们需要做降级配置

3.进入目录,在master分支下进行配置(如果创建好的目录中没有.git文件,使用git init初始化目录)

注意:

之所以要在master分支下进行配置,是为了在下文中运行 npm run eject

4.将原来的react-script删除

React降级配置及Ant Design配置

5.重新安装对应版本(比如1.x的版本,比较稳定的版本)

React降级配置及Ant Design配置

6.添加git库(将以上做的修改添加到git库,这也是为什么如果没有.git文件,一定要先初始化)

React降级配置及Ant Design配置

7.运行npm run eject(如果有报错,可以不用管,只要有ejected successfully就可以)

React降级配置及Ant Design配置

8.由于重新配置可以先删除node-moduls,然后在 npm i重新安装依赖

React降级配置及Ant Design配置

9.npm start,查看是否能运行(可能会报错,解决方法再下面)

10.删除package.json中的browserslist(因为这个配置是react-scripts2.x版本的,再降级以后,如果还存在,代码运行会报错)

React降级配置及Ant Design配置

配置less

1.src中内容可以都删除,留下index.js

React降级配置及Ant Design配置

2.创建一个App.js(此时查看是否能运行,显示App.js的内容)

React降级配置及Ant Design配置

3.创建App.less,并将文件引入到App.js中(import './App.less')

React降级配置及Ant Design配置

4.安装less包

React降级配置及Ant Design配置

5.进行less文件的配置,找到config中的dev文件

React降级配置及Ant Design配置

6.找到里面的css的配置,复制一份到css配置文件的下方,将loader中css换成less-loader以及options为以下内容

React降级配置及Ant Design配置
React降级配置及Ant Design配置

7.配置完选项,需要重启项目才能生效


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

The Smashing Book

The Smashing Book

Jacob Gube、Dmitry Fadeev、Chris Spooner、Darius A Monsef IV、Alessandro Cattaneo、Steven Snell、David Leggett、Andrew Maier、Kayla Knight、Yves Peters、René Schmidt、Smashing Magazine editorial team、Vitaly Friedman、Sven Lennartz / 2009 / $ 29.90 / € 23.90

The Smashing Book is a printed book about best practices in modern Web design. The book shares technical tips and best practices on coding, usability and optimization and explores how to create succes......一起来看看 《The Smashing Book》 这本书的介绍吧!

MD5 加密
MD5 加密

MD5 加密工具

html转js在线工具
html转js在线工具

html转js在线工具

正则表达式在线测试
正则表达式在线测试

正则表达式在线测试