从零开始搭建vue项目

前提:保证在node环境下.已安装cnpm.或者npm.

第一步:打开空文件夹.命令窗口输入指令:

cnpm install --g vue-cli

第二步:继续输入指令:

vue init webpack myproject

运行到这一步就会发现已经有了项目文件夹:

命令窗口显示一下信息的时候,代表已安装成功:

第三步:利用vscode打开文件夹.运行项目:

在页面打开http://localhost:8080

这样就成功运行了.

接下来介绍一下vue项目目录:

assets中存放的静态文件是会经过webpack处理的，一般放一些图片之类的静态资源，而static则不会收到webpack的影响，调用的时候也是通过绝对路径调用的，通常用来存放一些第三方的静态资源库。

路由配置:

在src文件夹下新建pages文件夹.用来存放页面.
在pages文件夹下新建Home文件夹.
如图引入新的页面，路由跳转可通过this.$router.push('/Home')