前端学习（一）搭建vue框架

PS：本来在这篇之前还写一片webstorm激活的文章，但是不给发，那就没办法了。需要激活的可以评论或者私聊吧。
正文：
我学习前端选择用vue框架，这个选别的也行。我之前在公司有写过一点前端代码，但是都没自己搭建过框架，都是用之前同事搭建好的，那时用的是angularJS。现在隔了几年感觉前端还是得自己学学，就从头学一遍吧。当然不是一步一步学习基础，而是直接上手写网页了。

我搭建环境主要参考：https://blog.csdn.net/weixin_40760196/article/details/79952652，但是由于年代久远，有些步骤得更新了，就自己记录一遍。

PS：搭建vue框架必须安装git

CMD要用管理员身份运行！！！

安装node.js

1. 去官网下载：https://nodejs.org/zh-cn/，选择稳定版本吧，这个都可以，看自己喜欢。

2. 下载完安装就是了，只是安装完之后他会弹出几个窗口，提示在安装一些必要的插件，按提示随便点点，然后等一段时间（可能需要半个小时），让他自己安装完（也许不安装完也没事，我就直接把他关掉了）

3. 在cmd验证一下：

   node -v
   npm -v
   

PS：新版的node（win10）可能还需要添加环境变量：
先查看全局安装的目录是哪里：

npm prefix -g

然后再把该路径添加到环境变量：


配置腾讯源：

npm config set registry http://mirrors.cloud.tencent.com/npm/

安装webpack

npm install webpack -g
安装完验证：
webpack -v
此时他可能会提示要安装webpack-cli，那就执行下面命令：
npm install webpack-cli -g
然后再验证一遍，可以看到两个都安装好了

安装 vue

npm install -g @vue/cli
验证：
vue -V （V大写）

这里记住默认安装路径：C:\Users\Administrator\AppData\Roaming\npm\node_modules@vue\cli

创建项目

1. 打开webstorm，新建项目
   
   第一次创建项目他会需要下载一些依赖，控制台可能会提示你是否切换成淘宝的下载源，选择是就好了。
   PS：看到有一篇文章说location要与node.js放置在同一个磁盘下，比如node.js安装在D盘某个目录下，那么location也要选择D盘的，不知道是不是真的要这样，我没尝试，反正是放在同一个磁盘下了。
2. 等项目加载完，可以看到项目下创建了一个package.json，右键它，选择：“show npm Scripts”
   
   然后选择serve就运行程序了。
   
   然后就在浏览器输入：http://localhost:8080，就可以看到网页运行起来了。
   
   PS：下次运行就直接直接点运行就行了，不用选择右键啥的了。