03 2020 档案
摘要:增加插件 在 hand-webpck 文件夹下引入插件 less 在src 下新增 index.less index.less @nice-blue: #5b83ad; body { background: @nice-blue; } 在 webpack.config.js 配置使用的模块 let
阅读全文
摘要:编写 emitFile 方法 emitFile() { // 打包输出的路径 let main = path.join(this.config.output.path, this.config.output.filename) console.log(main, 'test') this.asset
阅读全文
摘要:在m-pack 通过path 引入 webpack.config.js let config = require(path.resolve('webpack.config.js')); console.log(config) 输出: { mode: 'development', entry: './
阅读全文
摘要:创建一个文件夹 这个文件夹 用来使用 webpack 的 npm init - y 初始化文件 引入 webpack webapck-cli 如: yarn add webpack webapck-cli -D 新建src目录 mkdir src 创建 index.js a.js b.js inde
阅读全文
摘要://一行 white-space: nowrap; text-overflow: ellipsis; overflow: hidden; word-break: break-all;//两行 text-overflow: -o-ellipsis-lastline; overflow: hidden;
阅读全文
摘要:1.table <el-table key="1" v-if="type 2" stripe :data="list" @cell-dblclick="celledit" :header-cell-style="headerCellStyle" > </el-table> @cell-dblclic
阅读全文
摘要:SyncWaterfallHook表示如果上一个回调函数的结果不为undefined,则可以作为下一个回调函数的第一个参数 回调函数接受的参数来自于上一个函数的结果 调用call传入的第一个参数,会被上一个函数的非undefined结果替换 当回调函数返回非undefined不会停止回调栈的调用 使
阅读全文
摘要:BailHook中的回调函数也是顺序执行的 调用call时传入的参数也可以传给回调函数 当回调函数返回非undefined值的时候会停止调用后续的回调 使用: const { SyncBailHook } = require("tapable"); //所有的钩子构造函数, 都接受一个可选的参数,
阅读全文
摘要:class SyncHook { constructor(args) { this.tasks = [] } tap(name, task) { this.tasks.push(task) } call(...args) { this.tasks.forEach((task) => { task(.
阅读全文
摘要:const { SyncHook } = require("tapable"); //所有的钩子构造函数, 都接受一个可选的参数, (这个参数最好是数组, 不是tapable内部也把他变成数组), 这是一个参数的字符串名字列表 //const hook = new SyncHook(["arg1",
阅读全文
摘要:1.下载clipboard.js npm install clipboard --save 2.引入 挂载到vue 上 import clipboard from 'clipboard' Vue.prototype.Clipboard = clipboard 3. 使用 <div style="al
阅读全文
摘要:我们可以配置 热更新 当我们修改代码的时候 会同步更新输出 配置: 在 devServer 配置 hot 为 true devServer: { contentBase: path.resolve(__dirname, 'dist'), host: 'localhost', compress: tr
阅读全文
摘要:我们在开发多个页面的项目的时候,有时候会在几个页面中引用某些公共的模块,这些公共模块多次被下载会造成资源浪费,如果把这些公共模块抽离出来只需下载一次之后便缓存起来了,这样就可以避免因重复下载而浪费资源 场景: 项目中 有 a.js b.js index.js other.js 文件 index.js
阅读全文
摘要:IgnorePlugin用于忽略某些特定的模块,让 webpack 不把这些指定的模块打包进去 测试例子: src/index.js import moment from 'moment' moment.locale('zh-cn') let date = moment().startOf('hou
阅读全文
摘要:1. exclude 排除我们安装插件里面的代码 2 . include: path.join(__dirname, 'src'), 主要包含的是输出文件的src 测试下 效果在小项目 中 不是特别明显
阅读全文
摘要:module.noParse 字段,可以用于配置哪些模块文件的内容不需要进行解析 不需要解析依赖(即无依赖) 的第三方大型类库等,可以通过这个字段来配置,以提高整体的构建速度 实例: 我们可以先安装 jquery 测试 打包测试下 耗时为 1000多ms 配置下 noParse 再次打包测试 耗时
阅读全文
摘要:let reUrl = /(http|https):\/\/([\w.]+\/?)\S*/ if (reUrl.test(values.url) false) { return this.$message.error('请输入以 http 或者 https 开头的url') }
阅读全文
摘要:1.安装依赖 npm i url-loader -D file-loader 解决CSS等文件中的引入图片路径问题 url-loader 当图片小于limit的时候会把图片BASE64编码,大于limit参数的时候还是使用file-loader 进行拷贝 2.js 中使用图片 import logo
阅读全文
摘要:@babel/plugin-proposal-class-properties (1) 这个是用来编译类的插件 (2) 安装插件 npm i @babel/plugin-proposal-class-properties -D (3)webpack.config.js 配置 { test: /\.m
阅读全文
摘要:1.Es6 转Es5 npm i babel-loader @babel/core @babel/preset-env -D 2.webpack.config.js { test: /\.m?js$/, exclude: /(node_modules|bower_components)/, //排除
阅读全文
摘要:module.exports = { root: true, env: { node: true }, 'extends': [ 'plugin:vue/essential', '@vue/standard' ], rules: { 'no-console': 0, // 在块级作用域外访问块内定义
阅读全文
摘要:<a-input @blur="validateDomainBlur" placeholder="请输入需要绑定的域名" v-decorator="['domain', { rules: [ { required: false, message: '请输入域名' }, ], getValueFrom
阅读全文
摘要:1. 安装 html 插件 yarn add html-webpack-plugin -D 2. 在 webpack.config.js 引入 const HtmlWebpackPlugin = require('html-webpack-plugin') plugins: [ new HtmlWe
阅读全文
摘要:npm i webpack-dev-server –D 安装插件 在 webpack.config.js 添加配置 contentBase 配置开发服务运行时的文件根目录 host:开发服务器监听的主机地址 compress 开发服务器是否启动gzip等压缩 port:开发服务器监听的端口 devS
阅读全文
摘要:1. 先修改 properties 文件的字符编码,不然出现乱码,进行如下设置 2. 类路径下创建 i18n 目录存放配置文件 点击红色方框可以编辑多个配置文件 比如: 3. 添加路径配置 注意 这里如果配置错误 会出现 springboot2.0 国际化页面 ?? XXX_zh_CN?? 这个错误
阅读全文
摘要:1. 基本配置文件 1. webpack.config.js const path = require('path') module.exports = { mode: 'production', entry: './src/index.js', output: { filename: 'bundl
阅读全文
摘要:1. 设置调试器端口 2. 添加调试配置 3. 重启项目 点击调试按钮 4. 点击调试按钮会出现 404 页面 这个时候把你项目 启动的 路径复制到浏览器中 在项目断点就可以调试了
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document<
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>插入排序</tit
阅读全文
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document<
阅读全文
摘要:1.添加依赖 <!--热部署--> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-devtools</artifactId> </dependency> 2.重新启动项目 3.测试 在
阅读全文
摘要:1. pom.xml 加入 Thymeleaf 启动器 <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependen
阅读全文
摘要:欢迎 页面映射 会从 4个静态资源目录 + 根路径 / 中 查找 index.html 页面 会在 静态资源目录下 与 根路径查找 (按该顺序) index.html页面; 收到 "/**" 请求映射 访问 localhost:8080/ 会在上面5个目录中查找 index.html 页面(因为/也
阅读全文
摘要:1.如果不是 /webjars/** 资源 if (!registry.hasMappingForPattern("/webjars/**")) { this.customizeResourceHandlerRegistration(registry.addResourceHandler(new S
阅读全文
摘要:我们可以在 WebMvcAutoConfiguration 这个类下查找一个方法 addResourceHandlers public void addResourceHandlers(ResourceHandlerRegistry registry) { if (!this.resourcePro
阅读全文