day01

项目步骤

1.安装vue脚手架

2.通过vue 脚手架创建项目

3.配置vue路由

4.配置element-ui组件库

5.配置axios库

6.初始化git远程仓库

7.将本地项目托管到github或者码云中

2.项目初始化

下载安装node. js
配置node. js环境变量
用nmp安装vue和vue cli，但是nmp是国外的！
配置nmp https://blog.csdn.net/u012830533/article/details/79986984

PS D:\environment\node-v14.6.0-win-x64> .\npm config set prefix " D:\environment\node-v14.6.0-win-x64\node_global"
PS D:\environment\node-v14.6.0-win-x64> .\npm config set cache " D:\environment\node-v14.6.0-win-x64\node_cache"

PS D:\environment\node-v14.6.0-win-x64> .\npm root -g
D:\environment\node-v14.6.0-win-x64\node_global\node_modules
PS D:\environment\node-v14.6.0-win-x64>

C:\Users\37310>node -v
v14.6.0

全局安装VUE及VUE-cli

在cmd命令行依次输入

npm i vue -g
npm i vue-cli -g

由于nmp下载慢或者无法下载
解决nmp i vue -g 卡顿问题 https://www.cnblogs.com/webdragon/p/9700879.html

C:\Users\37310>npm install -g cnpm --registry=https://registry.npm.taobao.org
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
D:\environment\node-v14.6.0-win-x64\node_global\cnpm -> D:\environment\node-v14.6.0-win-x64\node_global\node_modules\cnpm\bin\cnpm
+ cnpm@6.1.1
added 684 packages from 964 contributors in 56.5s

C:\Users\37310>cnpm i vue -g
Downloading vue to D:\environment\node-v14.6.0-win-x64\node_global\node_modules\vue_tmp
Copying D:\environment\node-v14.6.0-win-x64\node_global\node_modules\vue_tmp\_vue@2.6.11@vue to D:\environment\node-v14.6.0-win-x64\node_global\node_modules\vue
Installing vue's dependencies to D:\environment\node-v14.6.0-win-x64\node_global\node_modules\vue/node_modules
All packages installed (used 6ms(network 4ms), speed 0B/s, json 0(0B), tarball 0B)

C:\Users\37310>cnpm i vue-cli -g
Downloading vue-cli to D:\environment\node-v14.6.0-win-x64\node_global\node_modules\vue-cli_tmp
Copying D:\environment\node-v14.6.0-win-x64\node_global\node_modules\vue-cli_tmp\_vue-cli@2.9.6@vue-cli to D:\environment\node-v14.6.0-win-x64\node_global\node_modules\vue-cli
Installing vue-cli's dependencies to D:\environment\node-v14.6.0-win-x64\node_global\node_modules\vue-cli/node_modules
[1/20] commander@^2.9.0 installed at node_modules\_commander@2.20.3@commander
[2/20] multimatch@^2.1.0 installed at node_modules\_multimatch@2.1.0@multimatch
[3/20] async@^2.4.0 installed at node_modules\_async@2.6.3@async
[4/20] handlebars@^4.0.5 installed at node_modules\_handlebars@4.7.6@handlebars
[5/20] rimraf@^2.5.0 existed at node_modules\_rimraf@2.7.1@rimraf
[6/20] consolidate@^0.14.0 installed at node_modules\_consolidate@0.14.5@consolidate
[7/20] ora@^1.3.0 installed at node_modules\_ora@1.4.0@ora
[8/20] minimatch@^3.0.0 installed at node_modules\_minimatch@3.0.4@minimatch
[9/20] read-metadata@^1.0.0 installed at node_modules\_read-metadata@1.0.0@read-metadata
[10/20] semver@^5.1.0 installed at node_modules\_semver@5.7.1@semver
[11/20] coffee-script@1.12.7 existed at node_modules\_coffee-script@1.12.7@coffee-script
[12/20] uid@0.0.2 installed at node_modules\_uid@0.0.2@uid
[13/20] inquirer@^6.0.0 installed at node_modules\_inquirer@6.5.2@inquirer
[14/20] user-home@^2.0.0 installed at node_modules\_user-home@2.0.0@user-home
[15/20] tildify@^1.2.0 installed at node_modules\_tildify@1.2.0@tildify
[16/20] metalsmith@^2.1.0 installed at node_modules\_metalsmith@2.3.0@metalsmith
[17/20] download-git-repo@^1.0.1 installed at node_modules\_download-git-repo@1.1.0@download-git-repo
[18/20] request@^2.67.0 installed at node_modules\_request@2.88.2@request
[19/20] chalk@^2.1.0 installed at node_modules\_chalk@2.4.2@chalk
[20/20] validate-npm-package-name@^3.0.0 installed at node_modules\_validate-npm-package-name@3.0.0@validate-npm-package-name
deprecate request@^2.67.0 request has been deprecated, see https://github.com/request/request/issues/3142
deprecate metalsmith@2.3.0 › gray-matter@2.1.1 › coffee-script@^1.12.4 CoffeeScript on NPM has moved to "coffeescript" (no hyphen)
All packages installed (235 packages installed from npm registry, used 1m(network 1m), speed 81.58kB/s, json 221(463.08kB), tarball 4.56MB)
[vue-cli@2.9.6] link D:\environment\node-v14.6.0-win-x64\node_global\vue@ -> D:\environment\node-v14.6.0-win-x64\node_global\node_modules\vue-cli\bin\vue
[vue-cli@2.9.6] link D:\environment\node-v14.6.0-win-x64\node_global\vue-init@ -> D:\environment\node-v14.6.0-win-x64\node_global\node_modules\vue-cli\bin\vue-init
[vue-cli@2.9.6] link D:\environment\node-v14.6.0-win-x64\node_global\vue-list@ -> D:\environment\node-v14.6.0-win-x64\node_global\node_modules\vue-cli\bin\vue-list

成功！！！

C:\Users\37310>vue -V
2.9.6

vue脚手架安装：这篇文章非常详细！
cnblogs.com/clschao/articles/10650862.html

少了一个系统配置！
注意，此时，默认的模块D:\nodejs\node_modules 目录将会改变为D:\nodejs\node_global\node_modules 目录，如果直接运行npm install等命令会报错的。我们需要做1件事情：
　1、增加环境变量NODE_PATH 内容是：D:\nodejs\node_global\node_modules

a. 临时使用：npm --registry https://registry.npm.taobao.org install express -g

b.永久使用　　　这里先不使用永久！

二、测试NPM安装vue-router

命令：npm install vue-router -g

运行npm install vue-cli -g安装vue脚手架，前端框架(架子)：关于脚手架的安装，看官网：https://cli.vuejs.org/zh/guide/，2.x的没有，目前只有3.x版本的，但是是兼容的，所以我们可以看官网说的老版本的那个文档：https://github.com/vuejs/vue-cli/tree/v2#vue-cli–，我们重点看这个文档。

通过上面这些安装，就把脚手架搭建完成了！
至于下面这个问题是无中生有的。
没有生成项目，就没有所谓的nmp run dev失败问题！
有了问题，就找找百度，面向百度编程！

vue脚手架安装npm run dev失败

https://www.cnblogs.com/xuhua123/p/11489758.html

D:\environment\node-v14.6.0-win-x64\node_global\node_modules\vue>cnpm install -save-dev stylus stylus-loader
cnpm@6.1.1 (D:\environment\node-v14.6.0-win-x64\node_global\node_modules\cnpm\lib\parse_argv.js)
npm@6.14.7 (D:\environment\node-v14.6.0-win-x64\node_global\node_modules\cnpm\node_modules\npm\lib\npm.js)
node@14.6.0 (D:\environment\node-v14.6.0-win-x64\node.exe)
npminstall@3.27.0 (D:\environment\node-v14.6.0-win-x64\node_global\node_modules\cnpm\node_modules\npminstall\lib\index.js)
prefix=D:\environment\node-v14.6.0-win-x64\node_global
win32 x64 10.0.18363
registry=https://r.npm.taobao.org