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 ...
随机推荐
- 增加swap分区,文件形式
查看swap a: sudo swapon -s b: free -m 文件方式: 1. 生成 生成一个1Gb(bs*count)的文件 [root@localhost ~]# dd if=/dev/ ...
- 搭建ftp
相信很多人都知道ftp吧.打个比方.在你们公司或者学校里面有一个ftp地址,里面存放了你们所需要的一些常用的资源.这样的话你们就可以随时登录这个ftp来拉取你所需要的资源(在范围内),简单的来说,ft ...
- centos7下安装redis的步骤
原贴地址:https://www.cnblogs.com/zuidongfeng/p/8032505.html 我linux服务器上是这样启动的: cd /tool/redis/redis-3.2.8 ...
- Hbase记录-HBase增删改查
HBase创建数据 本章将介绍如何在HBase表中创建的数据.要在HBase表中创建的数据,可以下面的命令和方法: put 命令, add() - Put类的方法 put() - HTable 类 ...
- gitlab与pycharm结合
一切都在图中 点开pycharm里的菜单选项 设置git代码仓库的地址 修改了代码之后,如何推送到git服务器上 通过pycharm下载代码仓库 pycharm中如何设置分支 pycharm新建了分支 ...
- Aircrack-ng介绍
1.介绍 Aircrack-ng主要使用了两种攻击方式进行WEP破解:一种是FMS攻击:一种是KoreK攻击. 2.主要组件 1.aircrack-ng 主要用于WEP及WPA-PSK密码的恢复,主要 ...
- luogu 2294 狡猾的商人 带权并查集
此题做法多啊 带权并查集,区间dp,前缀和,差分约束 1.自己写的前缀和, 11 #include<bits/stdc++.h> #define rep(i,x,y) for(regist ...
- Java EE之Hibernate异常总结【2】Field 'id' doesn't have a default value
Field 'id' doesn't have a default value问题解决方法 因为assigned是指主键是由人工分配的,而native则指主键值由库自动给出. <generato ...
- cocos2d-x 2.1.4 项目配置过程
http://cocos2d-x.org 下载cocos2d-x 2.1.4 使用project-creator.py脚本创建Cocos2d-win32 Application项目 1.先下载Wind ...
- [SDOI2010]古代猪文 (欧拉,卢卡斯,中国剩余)
[SDOI2010]古代猪文 \(solution:\) 这道题感觉综合性极强,用到了许多数论中的知识: 质因子,约数,组合数 欧拉定理 卢卡斯定理 中国剩余定理 首先我们读题,发现题目需要我们枚举k ...