基于vscode搭建React运行框架

1.下载gitbash
2.在gitbash里安装webpack，报错。搜索webpack安装教程，发现要先安装node
3.装好node之后安装eslint，全局安装出错，可能是因为环境变量，强行手动局部安装后成功，但是发现这个插件并不好用，于是一气之下删除整个node_module，结果再次运行有很多依赖包出错，下次不装eslint了
eslint的作用：统一代码风格，用于检查常见的JavaScript代码错误
4.装Debugger for chrome插件，可以不用输入命令点击三角符号启动，可打断点调试，要配置
5.装react-router-dom
输入 npm install react-router-dom --save

 npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

输入 npm i -f 解决

---

• node和npm的关系：node.js是js的一个运行环境，是一个服务端的js的解释器。
  node中包含有npm，安装好node后，也会发现npm已安装。
  npm是node的包管理器。在要使用别人写好的js代码时，如果都根据名字搜索一下，下载源码，解压，再使用，会非常麻烦。于是就出现了包管理器npm。大家把自己写好的源码上传到npm官网上，如果要用某个或某些个，直接通过npm安装就可以了，不用管那个源码在哪里。并且如果我们要使用模块A，而模块A又依赖模块B，模块B又依赖模块C和D，此时npm会根据依赖关系，把所有依赖的包都下载下来并且管理起来。试想如果这些工作全靠我们自己去完成会多么麻烦！
• TypeScript 是微软开发一款开源的编程语言，本质上是向 JavaScript 增加静态类型系统和对es6的支持。它是 JavaScript 的超集，所有现有的 JavaScript 都可以不加改变就在其中使用。它是为大型软件开发而设计的，它最终编译产生 JavaScript，所以可以运行在浏览器、Node.js 等等的运行时环境。
• bash：Windows开发的一个缺点就是与shell结合的不好，Git Bash提供了一种方式可以在Windows下执行Linux命令
• git git bash git shell的区别：
  1.git：版本管理工具，支持该工具的网站有Github、BitBucket、Gitorious、国内的osChina仓库、csdn仓库等等。
  2.shell：是linux，unix的外壳，也可以理解为命令行，就是输入并执行命令的地方，git通过命令行和图形界面两种方式使用shell。
  3.bash:最常用的shell之一
  4.git bash：方便你在windows环境下使用git命令的模拟终端（cmd的功能太弱），linux、unix可以直接使用git

---

重新配置react环境

1.安装git、vscode、npm
下载git就有gitbash
设置gitbash打开的默认路径，将属性的目标改为项目路径
2.https://code.visualstudio.com/docs/nodejs/reactjs-tutorial
根据tutoria：

• 安装并使用命令create-react-app生成项目，会自动react应用和依赖
• 在生成的项目下输入指令npm start即可打开react官网页面。保持它的运行，打开另一个终端，切刀项目下 ，输入“cd .”即可自动打开vscode该项目的代码
• 查看markdown文件：Ctrl+Shift+P，输入markdown选择open preview
• 将光标放在一个组件上，按F12弹出该组件的定义文件，按Alt+F12在当前页面显示该组件定义（按Esc退出）
• 安装debugger for chrome插件，添加debug配置
• Ctrl+shift+d：打开debug，点击齿轮添加debug 按F5直接弹出页面，并可调试