VUE之安装篇

---------------------------------

环境说明:win 10

-----------------------------------

1.去官网下载node.js,然后点击安装即可。

2.替换源,如果不替换,使用npm安装软件会非常的慢

替换方法:使用管理员权限打开cmd窗口,然后输入npm config set registry http://registry.npm.taobao.org 即可。

3.安装脚手架,vue-cli,主要用来创建vue项目

在cmd窗口(最好是以管理员权限打开的),输入命令 npm install vue-cli -g 等待安装完成即可。

4.创建一个项目

还是在cmd窗口,在你想要创建项目的路径上输入命令 vue init webpack pro_name ,其中pro_name为项目名。期间会提示输入一些信息,只要按回车即可,等待创建完成。创建完成后,会在选择的路径上生成一个新的文件夹(名字为pro_name)

5.使用VS code打开pro_name项目

6.打开VS code的Terminal.

然后在Terminal内输入

6.1  npm install  //等待安装结束

6.2 npm run dev //运行项目,成功运行则显示下图

VUE之安装篇

6.3 打开链接,使用ctrl+鼠标点击即可打开,正常会显示下图

VUE之安装篇

6.4 如果需要将前端项目部署到服务器运行,则需要先在Terminal中执行命令 npm run build ,然后将项目内的dist文件下的内容拷贝到服务器目录下即可。

6.5 其他一些前端需要安装包

安装element-ui

npm install element-ui -S

安装axios,用于前端和后台的数据交互

npm install axios

--------------------------------------

PS:最近想做一个物联网前端(vue)+后台(python)+硬件设备的一个项目。所以入坑了Vue。关于Vue这部分的内容,我不会涉及太多内容,能够完成基本的显示要求即可。在这里做一下简单记录。