Vue 安装和基础模板项目建立运行

目录

1.安装

2.项目建立

---

1.安装

官网：下载 | Node.js 

下载好运行exe文件一直点下一步安装就好，安装好后 cmd输入 node -v 会显示出node的版本

查看npm版本会如下有报错

 以管理员身份运行 cmd 执行以下命令更新npm到最新版本。

 npm-windows-upgrade --npm-version latest

使用淘宝镜像安装cnpm，安装成功后可以使用cnpm 代替npm下载资源文件。

npm install -g cnpm --registry=https://registry.npm.taobao.org

 这个我也不知道我安装成功没......

 安装vue脚手架构建工具，安装完后使用vue -V查看vue版本

npm install -g vue-cli

2.项目建立

使用 vue init webpack shantest 初始化一个项目，其中webpack是构建工具，整个项目是基于webpack的，shantest 是你想建立的项目名称。

执行“vue init webpack shantest”命令后，会让你选择一些选项，一般直接yes和默认（直接回车）即可，之后就需要等待比较久的时间即可。 

 项目建立成功后可以在项目下看到以下目录结构

  可以在cmd的提示信息看到怎么去运行这个项目：

cmd 执行 这两句就能进入到项目目录并运行vue项目。

执行 npm run dev 后会出现以下提示​

 按提示浏览器输入 http://localhost:8080 即可看到我们的vue项目的运行结果。

 ​​​​