vue webpack压缩代码_webpack不混淆、不压缩指定js文件
在项目中使用了mozilla/pdf.js,在使用中需要设置GlobalWorkerOptions.workerSrc,代码如下
import PDFJS from 'pdfjs-dist'
import workerSrc from 'pdfjs-dist/build/pdf.worker.js'
PDFJS.GlobalWorkerOptions.workerSrc = workerSrc;
console.log('workerSrc-->\n',workerSrc);
屏幕快照 2020-03-04 下午6.01.45.png
在运行的时候发现workerSrc被webpack和Babel压缩混淆成了代码字符串,而非PDFJS.GlobalWorkerOptions.workerSrc需要的xxx/pdf.worker.js这种形势的文件路径。
vuecl3配置
vuecl3免混淆js文件的配置方法如下,vue.config.js文件
module.exports = {
chainWebpack: config => {
config.module
.rule('pdf.worker.js')//名称 随意定制,应当避免重复
.test(/pdf\.worker\.js$/i) //正则文件名
.use('url-loader')
.loader('url-loader')
.tap(() => ({ limit: 10,name:'js/[name].[ext]' }))
.end();
}
}
运行npm run build后可以看到pdf.worker.js文件被忽略了,没有被混淆压缩,并且文件名也保持原模原样。
屏幕快照 2020-03-04 下午6.19.10.png
屏幕快照 2020-03-04 下午5.49.45.png
非vuecl3的weback配置
react工程或者vuecl2工程的webpack避免混淆压缩指定js代码配置如下:
config/webpack.config.dev.js和config/webpack.config.prod.js文件
...忽略
module.exports = {
...忽略
module: {
loaders:[
...忽略
{
test:/pdf\.worker\.js$/i,
loader: 'url',
query: {
limit: 10,
name: 'js/[name].[ext]'
}
}
],
}
};
以上就是webpack不打包指定的js文件的相关配置
vue webpack压缩代码_webpack不混淆、不压缩指定js文件相关推荐
- webpack 单独打包指定JS文件
背景 最近接到一个需求,因为不确定打出的前端包所访问的后端IP,需要对项目中IP配置文件单独拿出来,方便运维部署的时候对IP做修改.因此,需要用webpack单独打包指定文件. CommonsChun ...
- js webpack 配置路径_webpack中如何设置html引入js的路径
如题所一如分算需上来处一定迹面数一跳这件我子作示,如果webpa新直能分支调二浏页器朋代说,事刚需求ck这样配置 var htmlWebpackPlugin = require('html-webpa ...
- 删除vue打包大小限制_如何优化 Vue 祖传代码
目录 前言 为什么要优化 从哪里开始下手 现在开始 1.代码压缩 2.删除一些废弃的页面 3.使用 cdn 优化 4.修改路由引入方式 结果 前言 "这页面加载也太慢了!",一个宁 ...
- webpack打包php资源,webpack不打包指定的js文件
背景: 在项目实际开发中,有一些IP地址需要随时修改,进行部署,例如websocket的地址.因此在项目打包的时候,不希望保持IP地址的文件被打包,因此就需要把需要修改的常量独立出来,存放在一个js文 ...
- vue webpack压缩代码_vue.js - 解决vue-cli打包后自动压缩代码
当我们用vue脚手架做完项目后,npm run build打包之后, 有没有查看源码,全是压缩好的.但是我就不想让它压缩,该怎么办呢? 困惑了几天,查了各种资料.终于终于... 来,上干货: 首先,我 ...
- vue脚手架 打包压缩代码
正常我们开发完项目之后 就会使用 npm run build 进行项目打包 打包完成之后会显示一个 代码大小 这个是打包成功的效果 但可以看见后面 gizzped的效果 更小 我们怎么做到 进行gi ...
- webpack --- 发布环境的配置 代码压缩 代码分类
说明 源代码 本篇主要对发布环境的配置说明 前面2点是对webpack的一个复习. 第3点开始,逐步配置部署代码 1. Webpack发布的策略 2.1 在实际开发中,一般会有两套方案: 开发期间的项 ...
- 使用Webpack的代码分离实现Vue懒加载(译文)
当一个Vue的项目体积变得十分庞大的时候,使用Webpack的代码分离功能将Vue Components,routes或Vuex的代码进行分离并按需加载,会极大的提高App的首屏加载速度. 在Vue的 ...
- apk反编译(6)用ProGuard 混淆、压缩代码,压缩资源。
1.android官方文档 https://developer.android.com/studio/build/shrink-code 主要内容如下: 1.1 压缩代码 混淆生成的文件:<m ...
最新文章
- 每日一练:Python爬虫爬取全国新冠肺炎疫情数据实例详解,使用beautifulsoup4库实现
- EasyUEFI——简介、下载和安装
- spring boot 503_Spring实战读书笔记第4章 面向切面的Spring
- [机器学习] LightGBM on Spark (MMLSpark) 使用完全手册
- spring定时任务的配置使用
- datastage 使用小结
- java jni日志输出_java打印Jni层log
- linux下使用ThinkPHP注意大小写问题
- 《C和指针》——声明数组参数
- 微信小程序之验证码短信倒计时
- 正则 (?i,m,s,x,g)
- keyshot卡住了还能保存吗_Sketchup建模和渲染能取代3dsMax吗?
- 2018.3.4 st
- javafx自定义分页控件的实现
- jQuery实现消息提示框
- Flatty Shadow图标自动产生器——在线生成各种扁平化 ICON
- 手把手教你实现一个人脸认证登录系统
- 一文搞懂 Flink 网络流控与反压机制
- CentOS /Linux 开放80、8080端口或者开放某个端口
- caffe的concat层