创建Vue项目，配置router

配置环境

Npm ：用淘宝镜像 cnpm

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

error：Error: EACCES: permission denied,

没有权限

可以使用

sudo npm install -g cnpm --registry=https://registry.npm.taobao.org来安装，是用管理员的权限安装

安装完成后可以使用cnpm来代替npm了

接下来安装vue

cnpm install vue

安装webpack：

cnpm install -g webpack

Vue.js 提供一个官方命令行工具，可用于快速搭建大型单页应用。

安装vue-cli：

cnpm install --global vue-cli

创建一个项目

vue init webpack first-vue

? Project name firstvue

? Project description first vue project

? Author jerry

? Vue build standalone

? Install vue-router? Yes //是否使用vue-router

? Use ESLint to lint your code? Yes

? Pick an ESLint preset Standard

? Set up unit tests Yes

? Pick a test runner jest

? Setup e2e tests with Nightwatch? Yes

? Should we run `npm install` for you after the project has been created? (recomme

nded) npm

  vue-cli · Generated "my-project".

cd 进入项目文件夹

npm install

npm run dev

95% emitting                                                                  s   

DONE  Compiled successfully in 3337ms                                    21:32:39

I  Your application is running here: http://localhost:8080

复制http://localhost:8080到浏览器打开，如果出现Vue的官网logo及相关内容，则项目初始化成功

如果上面创建项目时? Install vue-router?选择yes，项目会直接配置好router，目录结构如图所示：

项目目录

打开index.js,

配置自己的组件

浏览器打开http://localhost:8080/#/login，看下是不是可以访问到自己写的vue组件，

接下来我们可以开始开发了，

目录

简单的项目初始化完成，我们可以开始我们的第一个vue项目了