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开发模板简介的更多相关文章

  1. Windows Phone 8初学者开发—第10部分:数据绑定应用程序和透视应用程序项目模板简介

    原文 Windows Phone 8初学者开发—第10部分:数据绑定应用程序和透视应用程序项目模板简介 原文地址: http://channel9.msdn.com/Series/Windows-Ph ...

  2. vscode 用户代码片段 vue初始化模板 Snippet #新加入开头注释 自动生成文件名 开发日期时间等内容

    vue文件模板 模板变量 https://code.visualstudio.com/docs/editor/userdefinedsnippets#_variables vue.json { // ...

  3. 【转】[总结]vue开发常见知识点及问题资料整理(持续更新)

    1.(webpack)vue-cli构建的项目如何设置每个页面的title 2.vue项目中使用axios上传图片等文件 3.qs.stringify() 和JSON.stringify()的区别以及 ...

  4. 中小研发团队架构实践之生产环境诊断工具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如同医生的听诊器,是系统生病时做问题诊断的逆向分析工具 ...

  5. 【原创】windows下搭建vue开发环境+IIS部署

    [原创]win10下搭建vue开发环境  如果要转发,请注明原作者和原产地,谢谢! 特别说明:下面任何命令都是在windows的命令行工具下进行输入,打开命令行工具的快捷方式如下图:     详细的安 ...

  6. vue开发体验

    *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !important; } /* ...

  7. vue开发环境搭建及热更新

    写这篇博客的目的是让广大的学者在初入Vue项目的时候少走些弯路,虽然现在有很多博客也有差不多的内容,但是博主在里面添加了一些学习时碰到的小问题.在阅读这篇博客之前,我先给大家推荐一篇文章<入门W ...

  8. WebStorm配置Vue开发环境

    虽然最新版的前端开发利器WebStorm支持了Vue,但是大部分人的WebStorm依然是默认不支持Vue的老版本(比如之前的我),所以需要手动添加WebStorm对Vue的支持.要想让WebStor ...

  9. vue的入门/简介

    vue 特点 1. 响应的数据绑定/响应式编程  2. 组件化 vue优点 1. 轻量级的框架  2. 简单易学 3. 双向数据绑定 4. 组件化 5. 视图,数据,结构分离 6. 虚拟DOM 7. ...

随机推荐

  1. 医院内外网之间通过网闸交互,通过端口转发加nginx代理实现内网访问外网

    首先介绍下主要需求,很简单,就是要在医院his系统内嵌公司的平台,实现内网直接访问外网 这是院方给我提供的网闸相关配置,105是医院内网的服务器,120是外网的服务器,中间通过网闸配置的几个端口实现互 ...

  2. 【算法】fhqtreap初探

    NOIP回来就一直想着学平衡树...平衡树写久了调不出来真的会头脑发热.jpg 大概只写了几道题... fhqtreap是不需要旋转的平衡树,仅使用分裂合并,一样可以保持平衡树的性质,并且可以非常简单 ...

  3. Oracle数据库连接生成DataX的job-Json

    package com.bbkj.main; import com.bbkj.DbUtils.ConnectionPoolManager; import com.bbkj.DbUtils.DbUtil ...

  4. [转载]Spring配置文件详解一:

    原文地址:与base-package="com.xx">Spring配置文件详解一:<context:annotation-config/>与<contex ...

  5. javaScript中的DOM补充

    一.DOM树 二.DOM节点 DOM 是这样规定的:    整个文档是一个文档节点     每个 HTML 标签是一个元素节点     包含在 HTML 元素中的文本是文本节点     每一个 HTM ...

  6. Java 创建线程的两种方法

    Java提供了线程类Thread来创建多线程的程序.其实,创建线程与创建普通的类的对象的操作是一样的,而线程就是Thread类或其子类的实例对象.每个Thread对象描述了一个单独的线程.要产生一个线 ...

  7. Guest CPU model configuration in libvirt with QEMU/KVM

    每个hypervisor对于guest能看到的cpu model定义都不同,Xen 提供host pass through,所以guest能看到的cpu和host完全相同. QEMU/KVM中gues ...

  8. js模板方法

    模板方法模式,定义一个操作中的算法的骨架,而将一些步骤延迟到子类中.模板方法使得子类可以不改变一个算法的结构即可重定义该算法的某些特定步骤.模板方法模式把不变行为搬到超类中,从而去除了子类中的重复代码 ...

  9. CentOS下用于查看系统当前登录用户信息的4种方法

    作为系统管理员,你可能经常会(在某个时候)需要查看系统中有哪些用户正在活动.有些时候,你甚至需要知道他(她)们正在做什么.本文为我们总结了4种查看系统用户信息(通过编号(ID))的方法. 1. 使用w ...

  10. Secret Code

    Secret Code 一.题目 [NOIP模拟赛A10]Secret Code 时间限制: 1 Sec  内存限制: 128 MB 提交: 10  解决: 6 [提交][状态][讨论版] 题目描述 ...