vue2 入门
来源:互联网 发布:radon变换算法 编辑:程序博客网 时间:2024/06/05 17:32
提到vue就要说下vue-cli,vue-cli是官方发布 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目。
生活中常见的脚手架就是盖房子的时候搭建在墙体上用于工人站立工作的区域,它能帮助工人快速的搭建房子。
vue-cli就是起到这样的作用,但是你也可以不用(如果你的项目足够简单)。
1.安装node
首先要安装 node.js环境,可以到中文官网http://nodejs.cn下载安装包。
解压傻瓜式安装,安装完成后,window+r 输入cmd调出命令行工具,输入node -v 和 npm -v,如果能显示出版本号,就说明安装成功。(npm是node的包管理工具,管理node包,包括:安装、卸载、更新、查看、搜索、发布等,是随着node一起安装的)
2.vue-cli安装
安装好了 node,我们全局安装 vue-cli(如果之前有安装过不需要再次安装)
npm install -g vue-cli
npm安装比较慢行业内一般使用淘宝镜像 cnpm来安装,首先要安装cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org
失败的话,使用 npm cache clean 清理缓存,然后再重新安装
安装好了使用 cnpm -v查看是否安装成功
然后使用 cnpm 安装 vue-cli
cnpm install -g vue-cli
使用vue -V (注意 V 大写)查看是否安装成功
如果报错 ,可能是 npm 版本过低, npm install -g npm 更新npm版本
3.生成项目
通过命令行工具进入到自己的项目目录,然后输入:
vue init webpack Vue-Project
webpack 是模板名称,Vue-Project是你自己起的项目名称,执行后会出现个配置页面(项目名称啊,项目描述啊,什么插件是否使用啊,一路回车就好),配置完成后,在当前目录生成一个以你自己起的项目名称命名的项目文件夹,然后进入项目目录(cd Vue-Project),安装依赖cnpm install(根据package.json文件安装需要的插件),会生成一个node_modules文件夹。
然后启动项目:
cnpm install
注意事项:
vue2.5.2
最新的vue启动后不会弹出浏览器
npm run build后找不到css和js,webpack.prod.conf.js 中output添加参数publicPath:’./’
入门demo
github 地址:点击
- vue2 入门
- Vue2入门小结
- Vue2.0入门
- vue2.0 入门
- vue2.0从入门到入坑
- vue2.0入门(一)
- vue2.0入门--创建项目
- vue2.0组件快速入门
- Vue2
- vue2.0学习入门(webpack)
- vue2 ssr 服务端渲染入门demo
- 入门Vue2.0及学习实战项目
- vue2.0 开发实践总结之入门篇
- vue2.0开发入门笔记 之 .vue文件
- vue2+webpack+express 简单入门:从前端到后台
- 学习VUE2.0入门到进阶路线推荐
- vue2.0从入门到努力(1)--安装环境
- vue2+vuex+vue-router 快速入门(一) 简单介绍
- Promise到底是个什么
- 玩嵌入式,可以试试Micro Bit!
- python @classmethod和@staticmethod 装饰器使用
- IntelliJ IDEA 2016注册方法和注册码
- wap端微信h5支付,用于非微信浏览器
- vue2 入门
- webpack编译后的文件防止缓存解决方案
- ffplay中avpacket和avframe的使用流程
- 表格操作
- 为什么指定了SDRAM,程序却烧写到了Nand flash?
- 第15节项目1-字符转换以及ASCLL码应用
- Git for Windows安装和基本设置
- Hystrix源码解析 —— 调试环境搭建
- json学习