- 博客(28)
- 收藏
- 关注
原创 webpack插件compression-webpack-plugin配合nginx进行gzip压缩,提高http请求速度
背景:gzip是一种文件压缩格式,浏览器可以自动解压这种格式,服务器返回的是gzip的格式文件时,response的头部会有Content-Encoding: gzip这样的头部告诉浏览器:“我返回的是gzip格式文件,你要用对应的方法去解压它”方式:有两种方式可以让服务器返回的资源是gzip压缩文件:一、在服务器端开启压缩http请求的目标文件,比如nginx(我只会ngi...
2020-01-09 15:20:46
2931
原创 vue2-preview 生产环境打包报错
情况:vue项目里使用了vue2-preview插件,但是在npm run build的时候打包报错原因:因为vue2-preview插件里使用了ES6的语法,而我的webpack的babel-loader配置把node_modules文件下的代码除外了 { test: /\.js$/, use: 'babel-loader', exclude: /node_...
2019-10-28 13:35:15
1846
原创 webpack从0到1的配置(一)
这篇关于webpack学习的文章包括以下知识点:打包入口、打包出口、loaders、plugins 配置打包脚本命令npm run dev、npm run build css打包压缩,js打包压缩 启用devServer,启用一个本地服务器,可通过localhost:8080在开发环境下调试 配置开发环境、生产环境不同的配置和环境变量准备工作:新建项目文件夹webpackLear...
2019-07-23 17:57:48
546
1
原创 webpack从0到1的配置(六)
webpack从0到1的配置(一)webpack从0到1的配置(二)webpack从0到1的配置(三)webpack从0到1的配置(四)webpack从0到1的配置(五)到此为止,webpack配置文件只有一个,下面我们要写三个配置文件,分别是webpack.base.config.js(开发和生产环境相同的配置)、webpack.dev.config.js(开发环境下的配置)...
2019-07-23 17:56:42
287
原创 webpack从0到1的配置(五)
webpack从0到1的配置(一)webpack从0到1的配置(二)webpack从0到1的配置(三)webpack从0到1的配置(四)到此为止我们只有一个npm run build命令,但是我们写vue项目一般会有两个命令,一个npm run dev,启动开发环境,一个npm run build 打包生产环境的代码。npm run dev 相当于把自己的电脑当中服务器,开...
2019-07-23 17:54:55
313
原创 webpack从0到1的配置(四)
webpack从0到1的配置(一)webpack从0到1的配置(二)webpack从0到1的配置(三)如何将css文件打包成单独的文件,并且归类放到css文件夹下 需要下载插件 npm installmini-css-extract-plugin --save-dev 可以使css,less打包成单独的css文件,而不是嵌在js文件里面 修改webpack.config.j...
2019-07-23 17:53:13
244
原创 webpack从0到1的配置(三)
webpack从0到1的配置(一)webpack从0到1的配置(二)前端项目总会使用到css,jpg, png这种资源的,按照webpack打包逻辑,我们应该把它们引入到打包入口文件main.js或者main.js引入的文件里。 在src下新建assets文件夹,assets目录下新建main.css文件main.css里写入#text-p { color: blue;...
2019-07-23 17:52:02
248
原创 webpack从0到1的配置(二)
阅读本篇博客需要预先阅读webpack从0到1的配置(一)。接着上篇博客讲plugins。我们希望在打包后的项目里有index.html文件,并且自动引入main.js文件 这里需要安装插件html-webpack-plugin npm install html-webpack-plugin --save-dev 修改webpack.config.js文件const path =...
2019-07-23 17:51:03
316
原创 webpack从0到1的配置(七)
webpack从0到1的配置(一)webpack从0到1的配置(二)webpack从0到1的配置(三)webpack从0到1的配置(四)webpack从0到1的配置(五)webpack从0到1的配置(六)接着讲webpack.prod.config.js的配置我们在生产环境下使用optimize-css-assets-webpack-plugin 插件来打包的时候压缩c...
2019-07-23 17:50:27
424
原创 vue项目配置image-webapck-loader,safari和firefox和ie都无法显示图片
按照image-webapck-loader github上介绍的那样配置,结果safari和firefox和ie都无法显示图片。只有chrome能正常显示rules: [{ test: /\.(gif|png|jpe?g|svg)$/i, use: [ 'file-loader', { loader: 'image-webpack-loader', ...
2019-05-22 16:21:48
793
2
原创 关于vue项目打包后部署到Tomcat后,background引用的图片路径错误的问题
css代码里使用里这样路径的图片: background: url('../assets/images/bg-01.jpg') no-repeat;打包过后bg-01.jpg会被打包到dist>static>img目录下。打包之后background: url('../assets/images/bg-01.jpg') no-repeat; 会被解析为backg...
2019-04-25 14:30:36
1293
原创 vue 的main.js 引入less报错
原因是:vue-cli生成的项目本来就内置了less处理器,而我又写了一遍,把红框里的删掉就好了
2019-04-15 15:23:07
2859
2
原创 git 命令学习
一 git 分支命令git branch [branchname] 新建分支 git checkout [branchname] 切换分支 git branch -D [branchname] 删除本地分支 git push origin :[branchname] 删除远程分支 // origin是远程仓库名 git meger [branchname] 合并分支 git che...
2019-04-12 14:13:07
148
原创 SVG的遮罩的理解
SVG的遮罩的理解遮罩就是规定,是用遮罩的图形哪些部分透明,哪些部分不透明。填充为黑色的部分就是透明的,填充为白色的部分就是不透明的。例子:<body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1"> <defs> <mask id=...
2019-01-28 09:46:10
2878
原创 箭头进度条动画
<!DOCTYPE html><html><head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>箭头进度条<
2018-12-21 16:34:19
722
1
原创 HTML attribute 与 DOM property 的对比
要想理解 Angular 绑定如何工作,重点是搞清 HTML attribute 和 DOM property 之间的区别。attribute 是由 HTML 定义的。property 是由 DOM (Document Object Model) 定义的。 少量 HTML attribute 和 property 之间有着 1:1 的映射,如 id。 有些 HTML attri...
2018-10-17 16:34:10
513
原创 ArcGis 初使用
<!DOCTYPE html><html><head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>arcGIS<
2018-10-09 16:26:09
231
原创 echart4 地图自定义tooltip
像这样的tooltip可以借助tooltip的formatter来实现,背景图片用extraCssText选项来实现extraCssText: "width:283px;height:274px;background: url(scene/assets/hebei/hb-family-monitor/OLT设备监控-tooltip.png) no-repeat;", ...
2018-10-08 15:18:24
7412
1
原创 工厂函数
工厂函数1. 首先它是一个函数2. 用于返回实例对象如下:function createSong(songid,singer) { return new Song({ songid: songid, singer: singer })}异步的工厂函数 返回的是一个异步对象function factoryFun() {...
2018-08-23 10:05:14
3098
原创 发布——订阅模式
发布——订阅模式发布—订阅模式在vue和node.js中广泛使用。发布—订阅模式的需要 发布者(对象)、订阅者(函数)、订阅函数、触发函数在vue中有这种代码:this.$on(); this.$emit();在node.js中有这种代码:var events = require('events'); var emitter = new events.EventEmitte...
2018-08-15 18:02:52
430
原创 RxJS Observable——理解观察者模式
Observable——理解观察者模式观察者模式(Observer mode)指的是函数自动观察数据对象,一旦对象有变化,函数就会自动执行。——《ECMAScript 6 入门》一 理解三个概念js对象是属性和函数的集合observable(可观察对象):由Rx.Observable.create 或创建操作符创建的的对象 observer(观察者对象):一个回调函数的集合...
2018-07-31 11:04:05
2679
原创 遇到问题的百度的解决方法
1.github使用ssh上传代码时出现Permission denied(publickey)的解决方案https://www.cnblogs.com/eoooxy/p/6075625.html
2018-07-18 15:43:52
181
原创 让div填满剩下的空间
让div填满剩下的空间 方案一 一 如果parent是body div2{ position:fixed; top:hpx; bottom:0;}二 如果parent是div.parent{ position:relative;}.div2{ position:absolute; top:hpx; botto...
2018-07-18 14:21:14
10647
原创 水平垂直居中方法总结
水平垂直居中方法总结一 line-height+vertical-align方法.parent{ line-height:父元素的height}img{ vertical-align:middle; text-align:center;}注:line-height只对文本起作用,对没有文本的行间元素不起作用,vertical-align的作用是使图片与文...
2018-07-18 13:53:53
113
原创 前后端数据流初探
前后端数据流初探前端用vue,后端用node.js,数据库用MongoDB一 启动MongoDB服务器为了从命令提示符下运行 MongoDB 服务器,你必须从 MongoDB 目录的 bin 目录中执行 mongod.exe 文件。我的mongoDB安装在F盘的software文件夹里面在cmd中执行:C:\Users\admin>F:\software\MongoDB\...
2018-07-18 10:30:05
1403
原创 事件处理函数里的this
用框架angular写代码时:ngOnInit(){ this.boldBtn.nativeElement.addEventListener( 'mouseover',this.showItems);}getItems(){}showItems(){ this.getItems();//这里的this指向一个button}错误:控制台报错:this.getItems...
2018-07-05 14:32:56
1522
原创 this总结
函数里this指向的总结 this存在两个地方一个是全局作用域下——this永远指向window对象;第二个是函数作用域下,需分情况讨论,但是有两条铁律:一 "this只有在函数被调用的时候才能被确定指向谁,函数定义的时候确定不了",二 "谁调用的这个函数,函数里的this就指向谁",。以下均讨论函数体里的this指向。一 构造函数里的thisfunction F...
2018-07-05 13:53:13
128
原创 箭头函数
箭头函数用法及特性一 () => 5 如果没有参数,就必须写上();函数体只有一条语句,可以不要大括号,并且会自动return那条语句的结果,等同于() => return 5;二 val => val*2;一个参数可以不要();函数体只有一条语句,也可以不要大括号,并且会自动return那条语句的结果,等同于 val => {return val*2;}三 (val1,v...
2018-07-05 12:17:04
273
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人