环境基本弄清楚了以后,开始总会写个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学习记录二的更多相关文章

  1. Material Calendar View 学习记录(二)

    Material Calendar View 学习记录(二) github link: material-calendarview; 在学习记录一中简单翻译了该开源项目的README.md文档.接下来 ...

  2. Spring Boot学习记录(二)--thymeleaf模板 - CSDN博客

    ==他的博客应该不错,没有细看 Spring Boot学习记录(二)--thymeleaf模板 - CSDN博客 http://blog.csdn.net/u012706811/article/det ...

  3. JavaScript学习记录二

    title: JavaScript学习记录二 toc: true date: 2018-09-13 10:14:53 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...

  4. 2.VUE前端框架学习记录二

    VUE前端框架学习记录二:Vue核心基础2(完结)文字信息没办法描述清楚,主要看编码实战里面,有附带有一个完整可用的Html页面,有需要的同学到脑图里面自取.脑图地址http://naotu.baid ...

  5. 业余学习react 学习记录

    http://www.ruanyifeng.com/blog/2015/03/react (阮一峰 react 学习) 1.搭建环境:npm 使用 React npm install -g cnpm ...

  6. react学习记录(二)

    JSX 在render中return标签的部分可以插入字符串,数字,数组 class Welcome extends React.Component { render(){ return ( < ...

  7. React学习记录

    托webpack的福,我终于可以开始写React了.==ORZ 我感觉我接近webpack工程师更进一步了哈哈哈. 以下所有内容均来自小红书,仅是我的个人记录,如想系统学习,请移步:React小书 : ...

  8. react学习记录(一)

    一.React是什么 声明式写法(强调结果,命令式编程强调过程) 组件化 一次学习,随处编写(多种应用场景,web程序,原生手机应用,系统应用,命令行工具) 二.为什么学习react 大公司加持-fa ...

  9. Spring Boot学习记录(二)–thymeleaf模板

    自从来公司后都没用过jsp当界面渲染了,因为前后端分离不是很好,反而模板引擎用的比较多,thymeleaf最大的优势后缀为html,就是只需要浏览器就可以展现页面了,还有就是thymeleaf可以很好 ...

随机推荐

  1. C/C++规范学习:

    一 关于浮点数: 1.1浮点数是否等于0判断:因为浮点数都有精度,不能拿浮点数直接和0.0f进行比较,而应该采用以下方法: if (f32Data == 0.0f) // 隐含错误的比较 #defin ...

  2. 迅雷笔试题 (JAVA多线程)启动三个线程,分别打印A B C,现在写一个程序 循环打印ABCABCABC

    题目:http://wenku.baidu.com/view/d66187aad1f34693daef3e8a.html 启动三个线程,分别打印A B C,现在写一个程序 循环打印ABCABCABC. ...

  3. 其它电脑访问mysql被拒绝

    例如,你想myuser使用mypassword从任何主机连接到mysql服务器的话. mysql> GRANT ALL PRIVILEGES ON *.* TO 'myuser'@'%' IDE ...

  4. hibernate log4j2输出sql带参数

    网上有很多是输出sql ,参数以?的形式,后面输出参数binding的log,还要自己拼接特别麻烦:这里整理下输出原生sql的方法.组件是log4jdbc 1: 修改pom.xml,确定有下面的配置, ...

  5. asp.net后台调用前台js代码

    为了通过ajax异步获取数据,我通过使用jquery的$(function{})方法,在页面加载时发送ajax请求,获取相关的数据.但是遇到了一个问题,当我发送的ajax请求需要根据传过来的URL参数 ...

  6. Unity C# Sting.Format的学习

    String.Format (String, Object) 将指定的 String 中的格式项替换为指定的 Object 实例的值的文本等效项. String.Format (String, Obj ...

  7. 面向对象(OOP)二

    一.“魔术”函数 - 自动调用 魔术方法 在面向对象有一些特别的方法,无需特别定义,已自动具备某些功能,例如构造函数__construt,这些方法统称魔术方法,在日后的编程中,可以使用这些方法的特性设 ...

  8. 《Python高效开发实战》实战演练——建立应用2

    为了在项目中开发符合MVC架构的实际应用程序,需要在项目中建立Django应用.每个Django项目可以包含多个Django应用.建立应用的语法为: #python manage.pystartapp ...

  9. static int a

    static int a只被本文件可见,外部文件不可见;而int a如果在外部文件作以下声明: extern int a,那么它在声明的文件里也是可见的 详见:http://bbs.csdn.net/ ...

  10. php之cURL惯用

    1.php cURL的强大:PHP 支持 Daniel Stenberg 创建的 libcurl 库,能够连接通讯各种服务器.使用各种协议.libcurl 目前支持的协议有 http.https.ft ...