webpack中的output.filename 和output.chunkFilename
filename
应该比较好理解,就是对应于entry
里面生成出来的文件名。比如:
{
entry: {
"index": "pages/index.jsx"
},
output: {
filename: "[name].min.js",
chunkFilename: "[name].min.js"
}
}
生成出来的文件名为index.min.js
。
chunkname
我的理解是未被列在entry
中,却又需要被打包出来的文件命名配置。什么场景需要呢?我们项目就遇到过,在按需加载(异步)模块的时候,这样的文件是没有被列在entry
中的,如使用CommonJS的方式异步加载模块:
require.ensure(["modules/tips.jsx"], function(require) {
var a = require("modules/tips.jsx");
// ...
}, 'tips');
异步加载的模块是要以文件形式加载哦,所以这时生成的文件名是以chunkname
配置的,生成出的文件名就是tips.min.js
。
(require.ensure() API的第三个参数是给这个模块命名,否则 chunkFilename: "[name].min.js"
中的 [name]
是一个自动分配的、可读性很差的id,这是我在文档很不起眼的地方2.0K发现的。。。)
webpack中的output.filename 和output.chunkFilename的更多相关文章
- output.filename 与 output.chunkFilename 的区别
// webpack.config.js module.exports = { entry: './src/index.js', output: { filename: '[name].bundle. ...
- webpack 无法打包:No configuration file found and no output filename configured via CLI option
报错内容 No configuration file found and no output filename configured via CLI option.A configuration fi ...
- No configuration file found and no output filename configured via Cli option.报错
webpack手动配置webpack.config.js文件,打包时出现的报错,可以试试这种解决方案 报错如下: No configuration file found and no output f ...
- 给定长度为 n 的整数数组 nums,其中 n > 1,返回输出数组 output ,其中 output[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积。-----力扣
给定长度为 n 的整数数组 nums,其中 n > 1,返回输出数组 output ,其中 output[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积. 示例: 输入: [1 ...
- Webpack中hash与chunkhash的区别,以及js与css的hash指纹解耦方案
文件的hash指纹通常作为前端静态资源实现增量更新的方案之一,Webpack是目前最流行的开源编译工具之一,其强大的功能也带来很多坑(当然,大部分麻烦其实都可以在官方文档中找到答案). 比如,在Web ...
- webpack中利用require.ensure()实现按需加载
webpack中的require.ensure()可以实现按需加载资源包括js,css等,它会给里面require的文件单独打包,不和主文件打包在一起,webpack会自动配置名字,如0.js,1.j ...
- webpack中实现按需加载
webpack中的require.ensure()可以实现按需加载资源包括js,css等,它会给里面require的文件单独打包,不和主文件打包在一起,webpack会自动配置名字,如0.js,1.j ...
- Webpack中publicPath设置
webpack中的path是当我们build的时候,输出项目打包文件的位置. webpack中的publicPath是我们打算放到web服务器下的目录,如果我们要放到网站的根目录下,那么就无需设置.如 ...
- webpack中环境变量的使用方法
这节课讲解一下,在webpack打包过程中,怎么去使用一些环境变量. 首先我有一个打包配置的三个文件 "scripts": { "dev-build": &qu ...
随机推荐
- ElasticSearch 之 dis_max tie_break的应用
1. 插入数据 PUT /my_index/my_type/ { "title": "Quick brown rabbits", "body" ...
- 怎么看SQL表里某列是否是自增列
开启或关闭自增列 SET IDENTITY_INSERT 表名 ON/OFF 1.语句 Select OBJECTPROPERTY(OBJECT_ID('表名'),'TableHasIdentity' ...
- eclipse中的项目无法添加到server下?
servers视图中不能将工作空间中的项目通过add and remove添加到新建的server下.解决方法如下: 1.右键点击项目,选择properties 2.点击Project facets( ...
- java实现Md5加密工具类
场景:平常我们用户注册的密码保存到数据库都不会是明文存储的.都是经过加密之后的.因为保证用户的安全性.我们通常是用md5算法来加密的. 这个只能算是一个工具类.没必要了解里面是怎么实现的.拿来用就可以 ...
- 图解项目管理流程:禅道&JIRA中的操作
禅道作为优秀的国产开源项目管理软件,禅道集产品管理.项目管理.质量管理.文档管理.组织管理和事务管理于一体,完整覆盖了研发项目管理的核心流程.禅道的设计理念在于提供一体化的解决方案,流程图完整呈现了项 ...
- docker部署安装
docker采用Linux内核技术,所以只能运行在Linux上,所谓的windows平台是使用boot2Docker工具,boot2Docker是在VisualBox构建一个linux精简化环境. B ...
- VUE2.0 饿了吗视频学习笔记(三):VUE2.0取消了v-link
https://gitee.com/1981633/vue_study.git 源码下载地址,随笔记动态更新中 写法如下 <div class="tab-item"> ...
- 网络类型IPv4和IPv6什么意思?区别?
在windows 7以上系统中,在设置本地IP地址的时候经常会看到同事含有IPV4协议项与IPV6协议项,并不同于以往windows xp系统中仅有TCP/IP协议项,不少朋友都觉得比较奇怪,询问编辑 ...
- MQTT协议-MQTT协议解析(MQTT数据包结构)
协议就是通信双方的一个约定,即,表示第1位传输的什么.第2位传输的什么…….在MQTT协议中,一个MQTT数据包由:固定头(Fixed header). 可变头(Variable header). 消 ...
- CRLF攻击的一篇科普:新浪某站CRLF Injection导致的安全问题(转)
转:https://www.leavesongs.com/PENETRATION/Sina-CRLF-Injection.html 新浪某站CRLF Injection导致的安全问题 PHITHON ...