- 博客(54)
- 收藏
- 关注
RSS订阅原创 vue的学习笔记（11）之vue cli详解
Vue CLI详解1、Vue CLI(1) 什么是Vue CLI(2) Vue CLI使用前提 - Node(3) Vue CLI使用前提 - Webpack(4) Vue CLI的使用2、Vue CLI2(1) 目录结构详解(2) Runtime-Compiler和Runtime-only的区别(3) render函数的使用(4) npm run buil过程(5) npm run dev过程(6) 修改配置：webpack.base.conf.js起别名3、Vue CLI3(1) 认识Vue CLI3(
2021-01-30 08:33:39
903
原创 vue学习笔记（10）之webpack下
webpack（下）1、loader的使用(1) 什么是loader？(2) css文件处理(3) less文件处理(4) 图片文件处理2、babel的使用3、webpack配置vue(1) 引入vue.js(2) el和template区别4、plugin的使用(1) 认识plugin(2) 添加版权的Plugin(3) 打包html的plugin(4) js压缩的Plugin5、搭建本地服务器7、webpack配置文件的抽离1、loader的使用(1) 什么是loader？loader是webpa
2021-01-30 00:29:38
490
原创 vue学习笔记（9）之webpack上
Webpack（上）1、什么是webpack？2、前端模块化3、webpack安装4、webpack起步5、js文件的打包6、webpack的配置(1) 入口和出口(2) webpack的局部安装(3) package.json中定义启动1、什么是webpack？官方的解释：At its core, webpack is a static module bundler for modern JavaScript applications.翻译：从本质上来讲，webpack是一个现代的JavaScri
2021-01-26 17:48:27
227
原创 vue的学习笔记（8）之前端模块化
1、为什么需要模块化## (1) JS的原始功能在网页开发的早期，js是作为一种脚本语言，做一些简单的表单验证或动画实现等，那个时候代码还是很少的。那个时候的代码是直接将代码写在script标签中的。但随着ajax异步请求的出现，慢慢形成了前后端的分离。客户端需要完成的事情越来越多，代码量也是与日俱增。为了应对代码量的剧增，我们通常会将代码组织在多个js文件中，进行维护。但是这种维护方式，依然不能避免一些灾难性的问题。比如全局变量同名问题，另外，这种代码的编写方式对js文件的==依赖顺序==几乎
2021-01-26 16:09:19
382
原创 使用 webpack 打包vue项目时，图片的URL地址变成了 [object object]又或者图片没有报错却加载不出来的原因
当使用webpack对图片进行打包时，发现图片路径变为url([object object])。这是因为我们在使用url-loader的时候，有一个limit属性，图片实际的大小大于limit指定的大小，因此会去使用file-loader，但项目里面没有这个包，要先用npm安装一下。或者直接将limit调大一点。也有可能是因为url-loader更新的版本造成的。错误：因此解决的办法有：方法一：如果没有报错，但图片没有显示出来。我们只需要在webpack.config.js中将url-loader进
2021-01-26 16:04:56
2404
1
原创 vue的学习笔记（7）之组件化开发下
组件化开发（下）组件化高级(1) 插槽slot(2）如何封装这类组件呢？slot(3）如何使用slot？(4) 具名插槽slot(5) 编译作用域(6) 作用域插槽a、作用域插槽b、作用域插槽新语法c、独占默认插槽的缩写语法d、 解构插槽Prop(7）动态插槽(8) 其他组件化高级(1) 插槽slotslot翻译为插槽：在生活中很多地方都有插槽，电脑的USB插槽，插板当中的电源插槽。插槽的目的是让我们原来的设备具备更多的扩展性。比如电脑的USB我们可以插入U盘、硬盘、手机、音响、键盘、鼠标等
2021-01-26 11:28:02
828
原创 UnhandledPromiseRejectionWarning: TypeError: loaderContext.getResolve is not a function
在Vue 项目中，使用了.less文件，那么就要安装less，less-loader。在安装完成后，使用npm run build去打包项目时，报如下错误：报该错误的原因是，通过npm install less less-loader --save-dev安装的是最高的版本，因此只要在控制台里面输入npm install less-loader@4.1.0 -s覆盖之前安装的版本（我这里是使用webStorm）。安装完毕后，在执行npm run build便可成功执行，显示结果。...
2021-01-26 11:19:44
362
原创 vue的学习笔记（6）之组件化开发中
组件化开发（中）1、父子组件的通信2、父级向子级传送(1) props的基本用法(2) props的数据验证3、子级向父级传送4、父子组件的访问(1) 父子组件的访问方式： $children(2) 父子组件的访问方式： $refs(3) 父子组件的访问方式： $parent(4) 非父子组件通信1、父子组件的通信在前面的学习中，我们提到了子组件是不能引用父组件或者Vue实例的数据的。但是，在开发中，往往一些数据确实需要从上层传递到下层：比如在一个页面中，我们从服务器请求到了很多的数据。其中一部分数据
2021-01-25 15:43:13
426
原创 vue的学习笔记（5）之组件化开发上
组件化开发（上）1、什么是组件化？2、注册组件的基本步骤(1) 组件的使用分成三个步骤：(2) 注册组件步骤解析3、 全局组件和局部组件4、 父组件和子组件5、注册组件的语法糖6、模板的分离写法7、 组件数据的存放(1)为什么是一个函数呢?1、什么是组件化？如果我们将一个页面中所有的处理逻辑全部放在一起，处理起来就会变得非常复杂，而且不利于后续的管理以及扩展。但如果，我们将一个页面拆分成一个个小的功能模块，每个功能模块完成属于自己这部分独立的功能，那么之后整个页面的管理和维护就变得非常容易了。组件化的
2021-01-20 17:00:39
386
原创 vue学习笔记（4）之基础语法补充
vue的基本语法补充1、v-model双向绑定input(1) v-model原理2、v-model双向绑定radio3、v-model绑定CheckBox4、v-model绑定select5、值绑定6、修饰符前面我们学的是在HTML标签中使用mustache语法实现数据的动态显示，利用vue的v-bind语法实现属性的动态绑定，通过v-on实现与用户的动态交互等等。其实，表单控件在前端的实际开发中也是非常常见的。特别是对于用户信息的提交来说，需要用到大量的表单元素。疑问：在vue中是通过什么来实现对表
2021-01-20 16:37:46
386
1
原创 vue学习笔记（3）之基础语法下
vue的基本语法（下）1、条件判断(1)v-if(2)v-if和v-else嵌套使用(3)v-if和v-else-if和v-else的嵌套使用(4)用个案例理解一下(5)v-show2、循环遍历(1) v-for遍历数组(2)v-for遍历对象(3) 组件的key属性(4) vue中检测数组更新3、案例1、条件判断v-if、v-else-if、v-else这三个指令与JavaScript的条件语句if、else、else if类似。Vue的条件指令可以根据表达式的值在DOM中渲染或销毁元素或组件(1
2021-01-12 20:28:38
1102
原创 vue学习笔记之拓展（1）
vue的三种经典高阶函数在用vue.js开发过程中为了使代码不那么复杂化，我们常常需要记住一些js中高阶函数的用法，这里推荐3种高阶函数的用法：filter，map，reduce
2021-01-12 00:50:55
272
原创 vue学习笔记（1）之初识vue
Day1-初识vue1、什么是vue？官方解释自我认识2、vue的安装3、vue中的MVVM什么是MVVM？（1）MVVM的定义？（2）计数器的MVVM4、创建Vue实例传入的options5、Vue的生命周期生命周期钩子生命周期图示1、什么是vue？官方解释Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的
2021-01-10 13:12:39
767
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人