vue路由及参数router

vue项目版本

1、创建一个vue项目步骤 （windows环境下）。创建vue项目前，检查系统是否具备创建项目的条件（是否已经安装好了node.js、webpack、vue-cli）。cmd打开终端。

1.1 如果还没安装node.js， 则先安装node.js ，安装完成后，查看node版本

node -v

1.2 安装淘宝镜像， 安装完成后查看npm版本：npm -v

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

1.3 安装webpack

npm install webpack -g
1.4 安装vue全局脚手架，vue-cli2.x使用 npm install -g vue-cli ， vue-cli3.x使用 npm install -g @vue/cli 安装， 查看vue版本： vue -V

npm install -g vue-cli
　　或

npm install -g @vue/cli
1.5 准备工作做好了，开始正式创建vue项目， 创建vue项目可以选择两种方式。下面的my_vue_pro是vue项目名字

vue init webpack my_vue_pro
　　或

vue create my_vue_pro
　 vue init 是vue-cli2.x的初始化方式，可以使用github上面的一些模板来初始化项目，webpack是官方推荐的标准模板名。vue-cli2.x项目向3.x迁移只需要把static目录复制到public目录下，老项目的src目录覆盖3.x的src目录。 vue create 是vue-cli3.x的初始化方式，目前模板是固定的，模板选项可自由配置，创建出来的是vue-cli3的项目，与vue-cli2项目结构不同，配置方法不同，具体配置方法参考官方文档。

如果vue版本还是2.x, 从vue-cli2.x升级到最新版：先执行卸载： npm uninstall -g vue-cli ， 再安装最新版 npm install -g @vue/cli

1.6 cd进入项目

cd my_vue_pro
1.7 添加需要的依赖包，比如添加vue路由vue-router依赖包，可以使用 npm install vue-router , 或者 vue add router

npm install vue-router
　　或

vue add router
1.8 安装所有依赖包， npm install 。卸载依赖包： npm uninstall xxx

cnpm install
1.9 运行项目，查看package.json文件中的scripts脚本中的运行方式， npm run dev 或 npm run serve

npm run serve

三级目录