vue.js学习
来源:互联网 发布:淘宝上卖水果怎么收费 编辑:程序博客网 时间:2024/06/16 13:01
首先要明确一个问题,你搭建的vue项目的路由是给谁去做的,一种是vue里面的路由,一种是node去配置路由
但是个人通过网上查找资料,只学会第一种,后续的学习中会继续更新第二种
说明一点,我写的这个是整体的思路,至于细节的东西,我会发链接出来,大家点进去重点学习
1.首先是安装node.js
http://www.cnblogs.com/yzadd/p/6547668.html 这个链接说明的很清楚,按照这个链接的内容来安装和配置就可以了
![](http://upload-images.jianshu.io/upload_images/4469601-4cf4be740edab7ec.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
2.安装npm,或者更新npm
由于新版的NodeJS已经集成了npm,所以之前npm也一并安装好了。同样可以使用cmd命令行输入"npm -v"来测试是否成功安装。如下图,出现版本提示便OK了。
![](http://upload-images.jianshu.io/upload_images/4469601-6e3af18ba9d58be4.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
3.然后安装vue-cli脚手架
安装vue-cli命令:npm install -g vue-cli
检测vue-cli安装成功
![](http://upload-images.jianshu.io/upload_images/4469601-21c1f223ee9c027a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
4.用vue-cli去创建一个新的项目,设置项目等相关的信息
命令:vue init webpack demo,可以根据自己的需求来进行设置里面的参数,如果不懂这里面的参数,可以参考
![](http://upload-images.jianshu.io/upload_images/4469601-162ef4dd0b9d0dae.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
5.这样的话一个vue项目就搭建起来了 ,按照依赖(记得任何在网上下载的vue的demo,都需要先安装依赖)
命令:npm install
这里容易出现一个错误,安装依赖的时候需要进到你新增的文件中,cd demo命令进入
然后在输入npm install,就会下载相关依赖;
![](http://upload-images.jianshu.io/upload_images/4469601-b8a10a04e69fc088.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
6.项目搭建起来之后就可以直接npm run dev的命令来启一个项目
![](http://upload-images.jianshu.io/upload_images/4469601-87851e818ea3d954.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
![](http://upload-images.jianshu.io/upload_images/4469601-6299f5f09f65b3b4.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
以上是基本的vue项目的搭建,当然一个app不可能就这么简单就成功了,肯定是需要设计前端的项目的里面的目录结构,另外比较重要的路由的情况
基于个人还在学习中,后续会不断更新自己学习的内容
vue项目的改造:www.jianshu.com/p/93dcbab5072c
- Vue.js学习
- vue.js学习
- Vue.js学习
- Vue.js学习笔记
- Vue.js 学习笔记
- Vue.js学习笔记
- Vue.js学习笔记
- Vue.js学习
- Vue.js过滤器学习
- Vue.js 学习(一)
- Vue.js学习笔记
- Vue.js学习
- Vue.js 学习示例
- 学习vue.js心得
- 如何学习vue.js
- vue.js总结学习
- Vue.js学习资料
- vue.js学习笔记
- 架构师需要注意DDoS攻击
- SDUT-3373-->数据结构实验之查找一:二叉排序树
- CrossFTP Enterprise(ftp上传工具)官方中文版V1.98.7下载 | CrossFTP破解版
- Longest Uncommon Subsequence I
- Mysql系列课程--第七章 触发器和存储过程
- vue.js学习
- python 字符串比较忽略大小写的方法
- 国外对各种设计模式讲解的比较好的Blog
- 网络编程
- 薪水支付案例
- gradle cleanidea ecplise 遇到的错误unsupported major.minor version 52.0
- UICC
- SQL查找非空元素(!=NULL)
- python编程:从入门到实践 第6章