React学习记录二
环境基本弄清楚了以后,开始总会写个hello world什么的,开发做了这么久了,就跳过这一步吧。
还是从打开vscode说起吧,这里文件菜单打开一个文件夹Demos,查看菜单打开集成终端,也可以使用快捷键ctrl+~

1.提示没有package.json

先运行:npm init
这个命令用于创建项目时自动生成一个至关重要的配置文件package.json
2.提示没有repository配置,没有README等
打开package.json文件
{
"name": "demo1",
"version": "1.0.0",
"description": "This test demo",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"private":true,
"author": "l",
"license": "ISC"
}
这种方式把项目声明为私有,这样npm就不会再提示配置repository和没有README
开始生成模板项目,全局安装命令:npm install -g create-react-app ,其中参数-g表示全局安装,也可以去掉这个参数,直接在vscode的命令行安装可以不需要此参数。
---------------------------------------------------------------------------------
全局安装后,也就不需要创建每个项目安装一次了!
运行create-react-app MyDemo创建一个名称为MyDemo的项目
运行成功后,目录结构

需要重新把目录定位到MyDemo的目录中,vscode菜单-文件-打开文件夹,选择MyDemo的文件夹
然后就可以开始试一试这个生成的Demo了,运行命令cnpm run start

默认是3000端口,打开浏览器,输入地址:http://localhost:3000/

基本上这样就算是成功了。
React学习记录二的更多相关文章
- Material Calendar View 学习记录(二)
Material Calendar View 学习记录(二) github link: material-calendarview; 在学习记录一中简单翻译了该开源项目的README.md文档.接下来 ...
- Spring Boot学习记录(二)--thymeleaf模板 - CSDN博客
==他的博客应该不错,没有细看 Spring Boot学习记录(二)--thymeleaf模板 - CSDN博客 http://blog.csdn.net/u012706811/article/det ...
- JavaScript学习记录二
title: JavaScript学习记录二 toc: true date: 2018-09-13 10:14:53 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...
- 2.VUE前端框架学习记录二
VUE前端框架学习记录二:Vue核心基础2(完结)文字信息没办法描述清楚,主要看编码实战里面,有附带有一个完整可用的Html页面,有需要的同学到脑图里面自取.脑图地址http://naotu.baid ...
- 业余学习react 学习记录
http://www.ruanyifeng.com/blog/2015/03/react (阮一峰 react 学习) 1.搭建环境:npm 使用 React npm install -g cnpm ...
- react学习记录(二)
JSX 在render中return标签的部分可以插入字符串,数字,数组 class Welcome extends React.Component { render(){ return ( < ...
- React学习记录
托webpack的福,我终于可以开始写React了.==ORZ 我感觉我接近webpack工程师更进一步了哈哈哈. 以下所有内容均来自小红书,仅是我的个人记录,如想系统学习,请移步:React小书 : ...
- react学习记录(一)
一.React是什么 声明式写法(强调结果,命令式编程强调过程) 组件化 一次学习,随处编写(多种应用场景,web程序,原生手机应用,系统应用,命令行工具) 二.为什么学习react 大公司加持-fa ...
- Spring Boot学习记录(二)–thymeleaf模板
自从来公司后都没用过jsp当界面渲染了,因为前后端分离不是很好,反而模板引擎用的比较多,thymeleaf最大的优势后缀为html,就是只需要浏览器就可以展现页面了,还有就是thymeleaf可以很好 ...
随机推荐
- java编程如何实现2017-01-16 22:28:26.0这样的时间数据,转换成2017:01:16:22:28:26这样的时间数据
不多说,直接上干货! timereplace.java package zhouls.bigdata.DataFeatureSelection.util; /* * 这个程序,是用来做补充的 */ p ...
- P1868 饥饿的奶牛
题目描述 有一条奶牛冲出了围栏,来到了一处圣地(对于奶牛来说),上面用牛语写着一段文字. 现用汉语翻译为: 有N个区间,每个区间x,y表示提供的x~y共y-x+1堆优质牧草.你可以选择任意区间但不能有 ...
- 用命令行的方式将本地项目上传到git
1.(先进入项目文件夹)通过命令 git init 把这个目录变成git可以管理的仓库 git init 2.把文件添加到版本库中,使用命令 git add .添加到暂存区里面去,不要忘记后面的小数点 ...
- Ecshop如何解决Deprecated: preg_replace()报错
今天安装Ecshop后,运行出现各种问题,其中 Deprecated: preg_replace() 之类的报错最多,下面贴出解决方案: 错误原因: preg_replace() 函数中用到的修饰符 ...
- Django组件:forms组件(简易版)
一.校验字段功能 1.模型:models.py class UserInfo(models.Model): name=models.CharField(max_length=32) pwd=model ...
- Miner3D Developer 开发工具
——可视化的数据挖掘整合工具 在开发项目中,客户的要求多种多样.当开发者面临高挑战的工作时,完全可以选择Miner3D这样的软件,依赖其强大的数据可视化的特点,以及其他的明显的技术优势,提供给最终用户 ...
- mybatis 异常处理:Invalid bound statement (not found)
mybatis 的使用过程中提示错误: org.apache.ibatis.binding.BindingException: Invalid bound statement (not found): ...
- 05、Win7上openSSH的安装与配置
05.Win7上openSSH的安装与配置 1.概述 linux上的ssh命令在网络通信场景下非常方便.现在windows也支持ssh方式和远程主机进行访问.如果只是使用ssh简单的访问功能,就需要很 ...
- shell实现网站备份
#!/bin/bash ##back web directory scripts #需要备份的目录写入与脚本同级目录test.txt文件中 DIR="/data/server/www&quo ...
- sublime完美编码主题
Theme – Soda 使用Ctrl+Shift+P快捷键或者进入菜单:Preferences(首选项) - Package Control(插件控制),调出命令输入框,输入Install Pack ...