Vue开发模板简介
1. 传统发开模式的问题
用传统模式引用vue.js以及其他的js文件的开发方式,会产生一些问题。
基于页面的开发模式:传统的引用vue.js以及其他的js文件的开发方式,限定了我们的开发模式是基于页面的,而不是基于组件的,组件的所有代码都直接写在页面中,这对于一些复杂的页面来说,不是好事情,代码的可读性会较差,也不便于管理。
组件无法重用:传统模式定义在HTML页面中的组件,无法被其他页面重用。我们只能通过复制粘贴的方式将组件代码拷贝到其他页面,这也违反了DRY原则。既然组件是Vue.js的重要概念,我们就应该利用好它。
2. Vue.js提供的开发模板
为了解决上述问题,Vue.js官方提供了一些开发模板,使我们能够快速地配置好vue.js的开发环境。基于这些开发模板,将使用.vue文件定义组件,使组件代码从HTML页面代码中分离出来。
Vue.js官方提供的模板分类:
|
类型 |
简单模式 |
完全模式 |
|
基于vue-cli和browserify的项目模板 |
vue-webpack-simpl |
vue-webpack |
|
基于vue-cli和webpack的项目模板 |
browserify-simple |
browserify |
简单模式:仅包含基vue.js开发必要的一些资源和包,使用该模式可以快速地投入到开发。
完全模式:除必要的资源和包外,还包括ESLink、单元测试等功能。
Vue开发模板简介的更多相关文章
- Windows Phone 8初学者开发—第10部分:数据绑定应用程序和透视应用程序项目模板简介
原文 Windows Phone 8初学者开发—第10部分:数据绑定应用程序和透视应用程序项目模板简介 原文地址: http://channel9.msdn.com/Series/Windows-Ph ...
- vscode 用户代码片段 vue初始化模板 Snippet #新加入开头注释 自动生成文件名 开发日期时间等内容
vue文件模板 模板变量 https://code.visualstudio.com/docs/editor/userdefinedsnippets#_variables vue.json { // ...
- 【转】[总结]vue开发常见知识点及问题资料整理(持续更新)
1.(webpack)vue-cli构建的项目如何设置每个页面的title 2.vue项目中使用axios上传图片等文件 3.qs.stringify() 和JSON.stringify()的区别以及 ...
- 中小研发团队架构实践之生产环境诊断工具WinDbg 三分钟学会.NET微服务之Polly 使用.Net Core+IView+Vue集成上传图片功能 Fiddler原理~知多少? ABP框架(asp.net core 2.X+Vue)模板项目学习之路(一) C#程序中设置全局代理(Global Proxy) WCF 4.0 使用说明 如何在IIS上发布,并能正常访问
中小研发团队架构实践之生产环境诊断工具WinDbg 生产环境偶尔会出现一些异常问题,WinDbg或GDB是解决此类问题的利器.调试工具WinDbg如同医生的听诊器,是系统生病时做问题诊断的逆向分析工具 ...
- 【原创】windows下搭建vue开发环境+IIS部署
[原创]win10下搭建vue开发环境 如果要转发,请注明原作者和原产地,谢谢! 特别说明:下面任何命令都是在windows的命令行工具下进行输入,打开命令行工具的快捷方式如下图: 详细的安 ...
- vue开发体验
*:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !important; } /* ...
- vue开发环境搭建及热更新
写这篇博客的目的是让广大的学者在初入Vue项目的时候少走些弯路,虽然现在有很多博客也有差不多的内容,但是博主在里面添加了一些学习时碰到的小问题.在阅读这篇博客之前,我先给大家推荐一篇文章<入门W ...
- WebStorm配置Vue开发环境
虽然最新版的前端开发利器WebStorm支持了Vue,但是大部分人的WebStorm依然是默认不支持Vue的老版本(比如之前的我),所以需要手动添加WebStorm对Vue的支持.要想让WebStor ...
- vue的入门/简介
vue 特点 1. 响应的数据绑定/响应式编程 2. 组件化 vue优点 1. 轻量级的框架 2. 简单易学 3. 双向数据绑定 4. 组件化 5. 视图,数据,结构分离 6. 虚拟DOM 7. ...
随机推荐
- js模板方法
模板方法模式,定义一个操作中的算法的骨架,而将一些步骤延迟到子类中.模板方法使得子类可以不改变一个算法的结构即可重定义该算法的某些特定步骤.模板方法模式把不变行为搬到超类中,从而去除了子类中的重复代码 ...
- c# 查找一个字符串在另一个字符串出现的次数
方法一: string test = "FF FF FF FF 01 00 82 00 00 A2 00 00 FB 07 FF FF FF FF 01 00 82 00 00 A2 00 ...
- django 使用多说 评论系统
效果图 方法:登录多说网站,创建站点.然后有下面的提示 ************************************************* 复制以下代码,并粘帖到您网页代码<bo ...
- The import java.util cannot be resolved
原因:项目buildpath不对 解决方案: 右键项目-------build path--------configuration build path 的选择libraries找到JRE(这个时候你 ...
- zoj3229 有源汇上下界最大流
题意:有一个人每天给妹子拍照,每个妹子有最少拍照数,每天有最大拍照数,每天只能给某些特定的妹子拍照,求最大拍照数 题解:很容易看出来的有源汇上下界最大流,对于有源汇 的上下界最大流,我们按照无源汇的操 ...
- Github 配置 SSH
HTTPS方式管理的直接输入登录用户名和密码就可以.下面介绍SSH的方式. mac系统为例,官方ssh参考:https://help.github.com/articles/generating-ss ...
- TCP/IP详解学习笔记(3)-IP协议,ARP协议,RARP协议【转】
转自:http://blog.csdn.net/goodboy1881/article/details/668556 把这三个协议放到一起学习是因为这三个协议处于同一层(网际层),ARP协议用来找到目 ...
- CTR点击率简介
点击率 简介 在搜索引擎(百度.谷歌)中输入关键词后进行搜索,然后按竞价等因素把相关的网页按顺序进行排列出来,然后用户会选择自己感兴趣的网站点击进去:把一个网站所有搜索出来的次数作为总次数,把用户点击 ...
- vue配置stylus
首先Vue-init webapck 随便一个name vue项目创建好之后 cnpm i (利用淘宝镜像) cnpm i stylus stylus-loader -D 进行安装和配置 styl常 ...
- SOLID
S.O.L.I.D是面向对象设计和编程(OOD&OOP)中几个重要编码原则(Programming Priciple)的首字母缩写. SRP The Single Responsibility ...