您现在的位置:首页 >> 前端 >> 内容

vue前端工程init的使用和实例分析

时间:2018/6/14 9:56:46 点击:

  核心提示:通过npm命令安装vuejs在用 Vue.js 构建大型应用时推荐使用 NPM 安装,NPM 能很好地和诸如 Webpack 或Browserify 的 CommonJS 模块打包器配合使用。(以下操...

通过npm命令安装vuejs

在用 Vue.js 构建大型应用时推荐使用 NPM 安装,NPM 能很好地和诸如 Webpack 或Browserify 的 CommonJS 模块打包器配合使用。(以下操作全在命令行中)

# 最新稳定版本

$ npm install -g vue  全局安装

# 最新稳定 CSP 兼容版本

$ npm install vue@csp

快速搭建大型单页应用

# 全局安装 vue-cli$ npm install -g vue-cli

# 创建一个基于 "webpack" 模板的新项目$ vue init webpack project-name

# 安装依赖$ cd project-name

$ npm install

$ npm run dev 启动项目

通过上面的一系列命令,我们便成功启动了项目,这时我们可以在浏览器中输入:  localhost:8080

集成ivew:

npm install iview --save  //安装iview  

npm install vue-router --save  //安装vue-router

目录结构:

vue前端工程init的使用和实例分析
vue前端工程init的使用和实例分析

main.js 里import router 代表router.js 的new router{}

vue前端工程init的使用和实例分析

App.vue 里面的<router-view></router-view> 是代表router/router.js 的new router{} 相当于一个<p>

npm install $ npm run dev 启动项目

Tags:VU UE E前 前端 
作者:网络 来源:lileLife的博