react + react-router + less +antd 开发环境搭建

1.基于create-reacte-app,需要先安装这个脚手架,然后初始化项目。

2.进入项目目录,首先 npm run eject 释放配置文件。

3.安装各种包

npm install react-router react-router-dom less less-loader antd react-redux --save

4.安装完之后,要去config文件夹下配置 less-loader

修改 webpack.config.dev.js 和 webpack.config-prod.js 这两个配置文件

test: /.css$/ 改为 /.(css|less)$/
test: /.css$/ 的 use 数组配置增加 less-loader

5.如果antd需要按需引入,参照antd官网 安装两个包,进行配置。

6.如果是原来的项目需要eject ,那么要保证仓库里没有 待追踪的文件。 可以先提交一次。再eject。还有一点,如果antd按需加载之后,需要把 eject命令 ,换回 react-script命令。

react + react-router + less +antd 开发环境的更多相关文章

  1. [React] react+redux+router+webpack+antd环境搭建一版

    好久之前搭建的一个react执行环境,受历史影响是webpack3.10.0和webpack-dev-server2.7.1的环境,新项目准备用webpack4重新弄弄了,旧的记录就合并发布了(在没有 ...

  2. React Native入门教程 1 -- 开发环境搭建

    有人问我为啥很久不更新博客..我只能说在学校宿舍真的没有学习的环境..基本上在宿舍里面很颓废..不过要毕业找工作了,我要渐渐把这个心态调整过来,就从react-native第一篇博客开始.话说RN也出 ...

  3. react 基础语法复习1- 搭建开发环境

    之前有看过阮一峰老师的react教程跟着做了一遍,学习了一下.好久没看,有点忘记了,这次跟着脚手架工具系统的复习一遍.顺便学习学习 react-router 和 redux 首先,脚手架工具我使用的是 ...

  4. Mac电脑配置IOS React Native开发环境配置笔记

    React Native(以下简称RN)的开发环境配置直接参考官方文档即可完成,不过对小白来说东西有点多,有些名词不是很好理解,这里就官方的安装文档稍微展开说一下. 中文版配置说明:不错的中文说明.官 ...

  5. 从零开始搭建webpack+react开发环境

    环境主要依赖版本 webpack@4.8.1 webpack-cli@2.1.3 webpack-dev-server@3.1.4 react@16.3.2 babel-core@6.26.3 bab ...

  6. 优化单页面开发环境:webpack与react的运行时打包与热更新

    前面两篇文章介绍初步搭建单页面应用的开发环境: 第一篇:使用webpack.babel.react.antdesign配置单页面应用开发环境 第二篇:使用react-router实现单页面应用路由 这 ...

  7. 从零开始配置TypeScript + React + React-Router + Redux + Webpack开发环境

    转载请注明出处! 说在前面的话: 1.为什么不使用现成的脚手架?脚手架配置的东西太多太重了,一股脑全塞给你,我只想先用一些我能懂的库和插件,然后慢慢的添加其他的.而且自己从零开始配置也能学到更多的东西 ...

  8. typescript+react+antd基础环境搭建

    typescript+react+antd基础环境搭建(包含样式定制) tsconfig.json 配置 // 具体配置可以看上面的链接 这里module moduleResolution的配置都会影 ...

  9. 使用webpack、babel、react、antdesign配置单页面应用开发环境

    这是Webpack+React系列配置过程记录的第一篇.其他内容请参考: 第一篇:使用webpack.babel.react.antdesign配置单页面应用开发环境 第二篇:使用react-rout ...

随机推荐

  1. 20145232 韩文浩 《Java程序设计》第6周学习总结

    教材学习内容总结 Java是以串流(Stream)的方式来处理输入与输出. 串流是一种抽象观念,从键盘输入资料,将处理结果输入档案,以及读取档案的内容等动作皆视为串流的处理. 输入串流代表对象为jav ...

  2. 基于WebGL的三维的物联网平台技术

    参加工作三年了,从一个搞调试的民工进阶为程序员,收获还是有那么一点的.慢慢讲一些. 去年在网上发现了https://hightopo.com/cn-index.html图扑软件的基于WebGL的三维j ...

  3. bzoj 2440 完全平方数 【莫比乌斯函数】

    题目 题意:第Ki 个不是完全平方数的正整数倍的数. 对于一个数t,t以内的数里的非完全平方数倍数的个数:num=1的倍数的数量−一个质数平方数(9,25,49...)的倍数的数量+两个质数的积平方数 ...

  4. bootstrap1.1

    <!DOCTYPE html>   <html>   <head>   <meta charset="utf-8" />   < ...

  5. 我的ecshop二次开发经验分享

    https://jingyan.baidu.com/article/358570f65dbad2ce4724fcc7.html

  6. [ASE][Daily Scrum]11.05

    在昨天的课程之后经过讨论进行了初步的分工,并制定出了我们的一个两周计划. 尚没有和老师讨论,已经询问了时间没有收到回复,等老师那边讨论过后我会在更新这个部分. 第一阶段的目标是用户能够在一个空白的地图 ...

  7. Maven的阿里云镜像

    打开“Maven安装目录/conf/settings.xml”文件,找到<mirrors>节点,添加: <mirror> <id>nexus-aliyun</ ...

  8. ADO.NET系列之事务和调用存储过程

    ADO.NET系列之Connection对象 ADO.NET系列之Command对象 ADO.NET系列之DataAdapter对象 ADO.NET系列之事务和调用存储过程 前几篇我们介绍了Conne ...

  9. .net图表之ECharts随笔01-最简单的使用步骤

    找了几种绘制图表的办法,后面选定了ECharts.下载链接如下,好像不同的ECharts有不同的用法,要下对. https://gitee.com/Tuky/SomeWebFrame/tree/mas ...

  10. 《jQuery基础教程(第四版)》学习笔记

    本书代码参考:Learning jQuery Code Listing Browser 原书: jQuery基础教程 目录: 第2章 选择元素 1. 使用$()函数 2. 选择符 3. DOM遍历方法 ...