06 2020 档案
摘要：正常加载可以认为是并行加载，在同一时间加载多个文件, index.js 中 引入 test.js , 点击按钮之前已经加载了 test.js懒加载：当文件需要使用时才加载构建后:页面一加载,只有index.js 执行了点击按钮后才会加载 test.js预加载 prefetch：会在使用之前，提前加载
阅读全文
摘要：代码分割:1. 可以把一个大的入口文件 分割 成 多个入口文件,实现并行加载,从而速度更快2.可以设置成按需加载,比如单页面开发,整个页面非常庞大,所以要根据路由拆分成多个文件,实现按需加载(拆分文件需要用到webpack拆分)在 webpack 中可以定义多入口，将不同的入口文件打包为不同的 ch
阅读全文
摘要：tree shaking：去除应用程序中没有使用到的无用代码前提： ① 使用 ES6 模块化② 开启 production 环境作用：减少代码体积test.jstest.js 中定义了 通过 ES6 模块 暴露了 add 和 count 两个方法，index.js 中 引入了 add 和 count
阅读全文
摘要：babel 缓存： babel-loader在执行的时候，可能会产生一些运行期间重复的公共文件，造成代码体积大冗余，同时也会减慢编译效率（已进行了 bable 兼容性处理的 js 进行缓存，再次构建的时候就不用重新 babale-loader 处理兼容问题） 设置：cacheDirectory：tr
阅读全文
摘要：多个 loader，但是每个文件只能匹配一个 loader，被一个 loader 处理，因此可以使用 oneOf 唯一匹配，不需要每个文件把所有的 loader 都询问一遍，可以提高 loader 的执行效率webpack.config.js:const {resolve} = require('p
阅读全文
摘要：source-map：一种提供源代码 到 构建后 代码映射技术（如果构建后的代码出错了，通过映射可以追踪源代码的错误）打开webpack.config.js source-map ：外部，错误代码准确信息 和 源代码的错误位置 devtool的全部值:devtool的全部值及介绍 /* source
阅读全文
摘要：HMR: hot module replacement 热模块替换 / 模块热替换作用: 一个模块发生变化, 只会重新打包这一个模块(而不是打包所有模块)极大提升构建速度 (开发环境) html文件: 默认不能使用HMR功能, 同时会导致问题:html文件不能热更新了~(不用做HMR功能)解决: 修
阅读全文
摘要：基础写法, 没有懒加载import Vue from 'vue' import Router from 'vue-router' import Comment from '@/assets/view/comment.vue' Vue.use(Router) export default new Ro
阅读全文
摘要：获取本页面的, dom元素节点: ref除了可以获取本页面的dom元素，还可以拿到 子组件中 的data 和 去调用子组件中的方法获取子组件中的 data子组件: 父组件: 父组件调用子组件中的方法子组件: 父组件: 子组件调用 父组件 中的 方法实际上是 子组件 触发一个自定义事件, 然后 父组件
阅读全文
摘要：需求 父组件点击 回复按钮; 子组件input 显示聚焦效果给子组件 绑定 一个 ref 给子组件绑定一个事件: 拿到 input 标签 在 父组件中 引用的 子组件 身上 也 添加一个 ref 给 父组件 绑定一个点击 事件 ,, 然后通过 $refs 直接调用 子组件中的 事件 父组件中的 点击
阅读全文
摘要：题目1: 一张纸厚度为0.0001米, 折叠多少次可以超过10000米方法一: for循环:let a = 0.0001; let num = 0; for(i=0;;i++){ a *= 2 num++; if(a > 10000){ break; } } console.log(num); //
阅读全文
摘要：在开发中, 从列表跳到详情页面, 然后再返回到列表页 ,此时 列表回到了第一个如果想保持 列表的状态 ,不变, 这里就要用到 keep-alive;没使用 keep-alive table栏回到 第一个了 使用 keep-alive 保持页面的状态;首先在路由中的meta标签中记录keepAlive
阅读全文
摘要：先创建一父组件 redact.vue再创建一个 子组件 userRedact.vue在 父组件里 引入 子组件 , 并且给 子组件传 值: 子组件 渲染 父组件 传来的 solot = "right" 只要 父组件中 使用 slot = "right", 所有的内容都被 渲染到 子组件的 slot
阅读全文
摘要：创建一个叫 LoginText.vue的子组件(父传子)在父组件中引入 LoginText.vue子组件, 并且给子组件 传递 labe, rule, placeholder...值 子组件接受父组件 传递过来的值 labe, rule, placeholder... 使用父组件, 传递过来的数据:
阅读全文
摘要：建模:sequelize model:generate --name Cart --attributes productId:integer,userId:integer,number:integer推模: sequelize db:migrate 创建一个 cart.js, 然后在app.js中引
阅读全文
摘要：通过wx.login 获取微信返回token: 安装异步请求request包（和axios是同类）cnpm i request –S在小程序端通过wx.login获取code（在小程序端不要使用他，code是一次性的）在后端需要请求微信官方的接口，把code和appid秘钥等等传给微信官方，等待微信
阅读全文
摘要：创建数据表(Users)sequelize model:generate --name User --attributes username:string,password:string,openid:string,admin:booleansequelize db:migrate #运行迁移创建一
阅读全文
摘要：1.请求拦截器: 请求拦截器的作用是在请求发送前进行一些操作:// 后添加的拦截器,先执行!!! // 添加请求拦截器(回调函数) axios.interceptors.request.use( config=>{ console.log('request interceptor 请求拦截器1');
阅读全文
摘要：axios.defaults.baseURL只能请求一个端口 如果同时也要访问4000的接口, 就要用到 instance这个可以使用自定义配置创建axios的新实例(可以创建过个) 同时可以访问两个端口
阅读全文
摘要：/* index.js */ /* GET请求 */ function testGet() { axios({ url:'http://localhost:3000/posts', method:'GET', params:{ id:2, xxx:"abc" } }).then(response=>
阅读全文
摘要：<script> /* GET请求 */ function testGet() { axios({ url:'http://localhost:3000/posts', method:'GET', params:{ id:2, xxx:"abc" } }).then(response=>{ cons
阅读全文
摘要：在axios里面的params:{ },是query的参数
阅读全文
摘要：请求报文 和 响应报文 都是由三个部分组成前台应用从浏览器端, 向后台服务器发送HTTP请求(请求报文)后台服务器端接收到请求后, 调用服务器应用处理请求, 向浏览器端返回HTTP响应(响应报文)浏览器端接受到响应, 解析显示响应体 / 调用监视回调 请求报文:请求行:method url 请求方式
阅读全文
摘要：第一次握手： 客户端告诉服务端说要创建连接第二次握手：服务端收到请求后知道有客户来了，然后就为客户端开启tcp socket的端口，开启后返回给客户端，返回的ack是客户端第一次请求过来的seq+1第三次握手： 客户端收到服务端的返回后知道被服务端答应了，这里请求里带上ack=y+1与服务端建立连接
阅读全文
摘要：1.创建一个 b.js 导出两个值 export const name = 'chen'; export const age = 21; 2. 两种使用方法 <script type="module"> // 方法一: 会导出这个默认的对象作为一个对象 import {name, age } fro
阅读全文
摘要：微信开发者助手请求成功, 真机出现406请求错误, 解决方法:在请求Header加Accept'Accept': "*/*"
阅读全文
摘要：runtimeChunk (生产环境)// 解决: 修改a文件 导致b文件的 contenthash变化,从而导致缓存失效 minimizer 修改压缩js 和css 的方案安装 cnpm i terser-webpack-plugin –D 插件
阅读全文
摘要：运行 npm install cors 这样使用vue就可以发送请求了
阅读全文
摘要：使用dll技术, 对某些库 (第三方库:jquery, react, vue...)进行单独打包, (优化重复打包)需要一个配置文件 webpack.dll.jsconst {resolve} = require('path')const webpack = require('webpack') module.exports = { entry:{ jquery:['jqu...
阅读全文
摘要：当 js 文件 是通过 cdn 加载到页面上的，webpack 打包时，需要忽略这一类库的打包，就需要在 webpack 配置中添加 externals 配置，如当页面上 jQuery 库通过 cdn 方式加载，externals 需要过滤掉 jQuery库的打包:const {resolve} = require('path')const HtmlWebPackPlugin = require(...
阅读全文
摘要：cnpm i thread-loader –D 开启多进程打包,进程启动大概为600s,进程通信也有开销(适合大项目使用)const { resolve } = require('path')const HtmlWebpackPlugin = require('html-webpack-plugin') process.env.NODE_ENV = 'production' modul...
阅读全文
摘要：PWA：渐进式网络开发应用程序(离线可访问)，需要通过serviceWorker 实现， 首先，webpack 配置使用 workbox-webpack-plugin 这个插件，生成一个 serviceWorker 配置文件 引入插件: 在plugins插件入口处引入插件 接着，在入口文件 inde
阅读全文
摘要：var express = require('express'); var router = express.Router(); var models = require('../models') // 引入模板 var Op = models.Sequelize.Op // 查询所有 router
阅读全文
摘要：HMR: hot module replacement 热模块替换 / 模块热替换 webpack配置-source-map（让错误无处可逃） webpack优化系列-oneOf wepack与浏览器缓存-contenthash webpack-tree shaking(树摇) webpack-co
阅读全文
摘要：1.手动安装 Node.js https://nodejs.org/zh-cn/ 2.配置 npm 淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 3.安装 Laragon 集成环境和 Navicat 客户端 这
阅读全文
