从头搭建一个React应用
node,webpack这些就不一一介绍怎么安装了,默认大家都知道。
一、npm install -g create-react-app
首先全局安装react的脚手架工具 create-react-app

上面提示,npm有新版本了,哎,先不管。
二、新建一个react项目

哦吼,华丽地报错了,先不要慌,我们看到报错信息是 cb() never called! This is an error with npm itself.
好吧,大概知道了是npm的问题,应该是版本问题?那么,来更新一下咯:

嗯哼,还是报错?那就百度一下吧。百度的结果是:
①npm cache clean -f (清除npm缓存)
②npm install -g n (安装最新版node helper)

WTF?
③npm install -g n --force(安装最新版node:stable)

④npm install
重新安装npm好了之后,继续重新新建react项目

看来包还挺多的。
三、npm start

露,总是曲折的,这里又报错了,是webpack版本的问题,话说我已经大半年没更新电脑上的node、webpack、npm的版本了,正好趁这个机会,全部更新一次。
其实报错信息下面,还提出了解决方案(7 steps):

说了那么多,就是要你重新装依赖。
其后,我装了yarn、并且npm run eject(参考博客:https://blog.csdn.net/nideshijian/article/details/87279597)
之后,删除了项目下的,node_modules,再次npm install ------> npm start;

四、目录结构

至于如何开发,目前看上去,和vue的结构还是有一些区别的,所以,有待后期继续学习。
从头搭建一个React应用的更多相关文章
- 从零开始搭建一个react项目
Nav logo 120 发现 关注 消息 4 搜索 从零开始搭建一个react项目 96 瘦人假噜噜 2017.04.23 23:29* 字数 6330 阅读 32892评论 31喜欢 36 项目地 ...
- 从0到1用react+antd+redux搭建一个开箱即用的企业级管理后台系列(基础篇)
背景 最近因为要做一个新的管理后台项目,新公司大部分是用vue写的,技术栈这块也是想切到react上面来,所以,这次从0到1重新搭建一个react项目架子,需要考虑的东西的很多,包括目录结构.代码 ...
- 【webpack系列】从零搭建 webpack4+react 脚手架(一)
搭建一个React工程的方式有很多,官方也有自己的脚手架,如果你和我一样,喜欢刨根究底,从零开始自己一行一行代码创建一个React脚手架项目,那你就来对地方了.本教程是针对React新手,以及对web ...
- 从头开始搭建一个dubbo+zookeeper平台
本篇主要是来分享从头开始搭建一个dubbo+zookeeper平台的过程,其中会简要介绍下dubbo服务的作用. 首先,看下一般网站架构随着业务的发展,逻辑越来越复杂,数据量越来越大,交互越来越多之后 ...
- 从头开始搭建一个Spring boot+RabbitMQ环境
*:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !important; } /* ...
- 使用React全家桶搭建一个后台管理系统
引子 学生时代为了掌握某个知识点会不断地做习题,做总结,步入岗位之后何尝不是一样呢?做业务就如同做习题,如果‘课后’适当地进行总结,必然更快地提升自己的水平. 由于公司采用的react+node的技术 ...
- 搭建一个简单的React项目
我是使用了create-react-app来搭建的基本框架,其中的原理和vue-cli差不多的脚手架.(当然也可以自己配置项目目录,这里我偷了一下懒) npm install -g create-re ...
- 快速搭建一个基于react的项目
最近在学习react,快速搭建一个基于react的项目 1.创建一个放项目文件夹,用编辑器打开 2.打开集成终端输入命令: npm install -g create-react-app 3. cre ...
- react全家桶从0搭建一个完整的react项目(react-router4、redux、redux-saga)
react全家桶从0到1(最新) 本文从零开始,逐步讲解如何用react全家桶搭建一个完整的react项目.文中针对react.webpack.babel.react-route.redux.redu ...
随机推荐
- 编码解码--url编码解码
url编码解码,又叫百分号编码,是统一资源定位(URL)编码方式.URL地址(常说网址)规定了常用地数字,字母可以直接使用,另外一批作为特殊用户字符也可以直接用(/,:@等),剩下的其它所有字符必须通 ...
- 20145329 《Java程序设计》实验一总结
实验指导教师:娄嘉鹏老师 实验日期:2016.4.8 实验时间:16:30~18:30 实验序号:实验一 实验名称:Java开发环境的熟悉 实验目的与要求: 使用JDK编译.运行简单的Java程序. ...
- params
using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace Ch06 ...
- DispatcherServlet讲解
1.1.1.DispatcherServlet作用DispatcherServlet是前端控制器设计模式的实现,提供Spring Web MVC的集中访问点,而且负责职责的分派,而且与Spring I ...
- Hibernate的懒加载session丢失解决方法
在web.xml加入spring提供的过滤器,延长session的生命周期 <!--Hibernate的懒加载session丢失解决方法 --> <filter> <fi ...
- jQuery编程规范与最佳实践(附带一些个人的笔记)
加载jQuery-Loading jQuery 1.坚持使用CDN来加载jQuery,这种别人服务器免费帮你托管文件的便宜干嘛不占呢.点击查看使用CDN的好处,点此查看一些主流的jQuery CDN地 ...
- Hibernate与 MyBatis的比较(转,留作以后细细钻研)
最近做了一个Hibernate与MyBatis的对比总结,希望大家指出不对之处. 第一章 Hibernate与MyBatis Hibernate 是当前最流行的O/R mapping框架,它出 ...
- 使用location.hash保存页面状态
hash 属性是一个可读可写的字符串,该字符串是 URL 的锚部分(从 # 号开始的部分). 语法 location.hash 在我们的项目中,有大量ajax查询表单+结果列表的页面,由于查询结果是a ...
- [spring]xml配置文件中bean属性的两种写法(p:configLocation <=> <property name="configLocation"/>)
1.当作bean节点的属性:p:configLocation: <!-- mybatis文件配置,扫描所有mapper文件 --> <bean id="sqlSession ...
- key中断
1 中断,很短的时间过去,然后回来.2 信号,软中断,而中断属于硬中断.3 实时内核,和分时内核.4 同步,预先知道发生,异步,预先不知道要发生,中断属于异步.5 arm一次执行一个中断.6 irq中 ...