![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
文章平均质量分 91
未禾
当有一天,迂迂回回后终于到达了想去的地方,才会惊讶地发现,原来之前所经过的一切,都是通往这里的必经之路,少一步都无法塑造出今天的你。
展开
-
Vue专栏目录
1. Vue环境搭建(Node)2. npm与yarn详细使用3. Vue介绍及其基本使用4. Vue指令(Directives)5. Vue修饰符(Modifier)6. Vue计算属性(computed)和侦听器(watch)7. webpack(module bundler,模块打包器)8. webpack基本使用9. webpack常用转换器(loader)与插件(plugin)10. Vue实例11. 模块管理规范(ES6、CommonsJs、AMD、CMD)原创 2024-01-26 16:52:50 · 53 阅读 · 0 评论 -
11.模块管理规范(ES6、CommonsJs、AMD、CMD)
模块管理规范(ES6、CommonsJs、AMD、CMD)模块化其实是一种规范、一种约束,这种约束会大大提升开发效率。将每个js文件看作是一个模块,每个模块通过固定的方式引入,并且通过固定的方式向外暴露指定的内容。按照js模块化的设想,一个个模块按照其依赖关系组合,最终插入到主程序中ES6、CommonJS、AMD、CMD指的都是一种规范原始JavaScript使用方法:<script>标签最原始的JavaScript文件加载方式,如果把每一个文件看做是一个模块,那么他们的接口通常是暴原创 2021-05-19 23:27:15 · 669 阅读 · 0 评论 -
10.Vue实例
Vue实例创建Vue实例每个Vue应用都是通过用Vue函数创建一个新的Vue实例开始的var vm = new Vue({ // 选项})Vue虽然没有完全遵循MVVM模型,但是设计也受到了它的启发。因此在文档中经常会使用vm (ViewModel的缩写)这个变量名表示Vue实例当创建一个Vue实例时,可以传入一个选项对象。一个Vue应用由一个通过new Vue创建的根Vue实例,以及可选的嵌套的、可复用的组件树组成。Vue组件都是Vue实例,并且接受相同的选项对象(一些根实例特有的选项原创 2021-05-19 23:24:16 · 410 阅读 · 0 评论 -
9.webpack常用转换器(loader)与插件(plugin)
webpack的loader(装载机)webpack主要用来处理js代码,并且webpack会自动处理js之间相关的依赖。单在实际开发中不仅仅有基本的js代码,也需要加载css、图片,也包括一些高级的将ES6转成ES5代码,将TypeScript转成ES5代码,将scss、less转成css,将.jsx、.vue文件转成js文件等webpack默认打开包除了js文件以外的所有文件,需要装不同的文件类型都需要安装对应的loader才可以加载,否则会报错loader使用过程(★)(1)通过npm安装需原创 2021-05-18 16:49:23 · 1615 阅读 · 0 评论 -
8.webpack基本使用
Chunk是代码块的意思,webpack在执行构建的时候,会把多个模块合并为一个文件,该文件就称为Chunkwebpack会为每个生成的Chunk取一个名称,Chunk的名称和Entry的配置有关:(1)如果entry是一个string或array,就只会生成一个Chunk,这时Chunk的名称是main(2)如果entry是一个object,就可能会出现多个Chunk,这时Chunk的名称是object键值对里键的名称。原创 2021-05-16 20:46:11 · 633 阅读 · 2 评论 -
7.webpack(module bundler,模块打包器)
webpack(module bundler,模块打包器)简介由来:由于前端之前js、css、图片等文件需要单独进行压缩和打包,这样团队人员处理很繁琐,Instagram团队就想让这些工作自动化,然后webpack应运而生webpack是一个模块打包器(module bundler),webpack视HTML、JS、CSS、图片等文件都是一种资源 ,每个资源文件都是一个模块(module)文件,webpack就是根据每个模块文件之间的依赖关系将所有的模块打包(bundle)起来webpack是前端的一原创 2021-05-16 17:32:54 · 620 阅读 · 0 评论 -
6.Vue计算属性(computed)和侦听器(watch)
Vue计算属性(computed)和侦听器(watch)计算属性(computed)模板内的表达式非常便利,但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护。所以不推荐在“{{ … }}”中放入太多逻辑<div id="example"> {{ message.split('').reverse().join('') }}</div>在这个表达式中模板不再是简单的声明式逻辑。对于任何复杂逻辑,应当使用计算属性什么是计算机属性?计算机原创 2021-05-16 14:36:58 · 475 阅读 · 0 评论 -
5.Vue修饰符(Modifier)
Vue修饰符(modifier)修饰符(modifier)是以半角句号“.”指明的特殊后缀,用于指出一个指令应该以特殊方式绑定<form v-on:submit.prevent="onSubmit">...</form>.prevent修饰符告诉v-on指令对于触发的事件调用event.preventDefault()事件修饰符事件修饰符描述.stop阻止冒泡(阻止事件向上级DOM元素继续传递).prevent阻止默认事件的发生,事件不再原创 2021-05-14 10:13:24 · 2081 阅读 · 1 评论 -
4.Vue指令(Directives)
Vue指令(Directives)指令(Directives)是带有“v-”前缀的特殊attribute(属性)。指令attribute的值预期是单个JavaScript表达式(v-for是例外情况)v-bind属性称为指令。指令带有前缀v-以指示它们是Vue提供的特殊属性,它们将特殊的反应性行为应用于渲染的DOM指令职责:当表达式的值改变时,将其产生的连带影响,响应式地作用于DOM指令描述v-bind元素属性绑定,简写“:”v-text元素文本绑定v-html原创 2021-05-14 10:08:48 · 3406 阅读 · 0 评论 -
3.Vue介绍及其基本使用
Vue(渐进式框架)Vue(读音/vju:/,类似于view)是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue也完全能够为复杂的单页应用提供驱动官方地址: https://cn.vuejs.org下载地址: https://cn.vuejs.org/v2/guide/installation.htmlVue基本使用原创 2021-05-13 15:21:26 · 179 阅读 · 0 评论 -
2.npm与yarn详细使用
npm(Node Package Manager,包管理器)npm通常称为node包管理器,主要功能就是管理node包,包括:安装、卸载、更新、查看、搜索、发布等。Npm是基于couchdb一个数据库,详细记录了每个包的信息(作者、版本、依赖、授权信息等)为什么使用npm?npm是一个让JavaScript程序员分享和复用代码的工具。有了它,JS程序员能高效地管理和发布自己要分享的代码。但是进行分享,需要的依赖的代码越来越多,所以用一个工具把这些代码集中到一起来管理;买个服务器作为代码仓库(regi原创 2021-05-12 16:35:38 · 5173 阅读 · 0 评论 -
1.Vue环境搭建(Node)
Node.js基本介绍Node.js是一个可以让JavaScript运行在服务器端的平台。它是一个为实时Web应用开发而诞生的平台,它从诞生之初就充分考虑了在实时响应、超大规模数据要求下架构的可扩展性。这使得它摒弃了传统平台依靠多线程来实现高并发的设计思路,而采用了单线程、异步I/O、事件驱动式的程序设计模式,其轻量又高效(基于Chrome V8引擎的JavaScript运行环境)(1)Node.js是一个基于Chrome V8引擎的JavaScript运行环境(2)Node.js使用了一个事件驱动、原创 2021-05-12 15:14:55 · 1432 阅读 · 1 评论