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 ...
随机推荐
- A*算法(附c源码)
关于A*算法网上介绍的有很多,我只是看了之后对这个算法用c写了一下,并测试无误后上传以分享一下,欢迎指正!下面是我找的一个介绍,并主要根据这个实现的. 寻路算法不止 A* 这一种, 还有递归, 非递归 ...
- Python IPy模块
#!/usr/bin/env python # -*- coding: utf-8 -* # Created by YangYongming at 2018/09/17 20:22 # FileNam ...
- RocketMQ在windows环境下的安装
原博地址:https://www.jianshu.com/p/4a275e779afa 一.预备环境 1.系统 Windows 2. 环境 JDK1.8.Maven.Git 二. RocketMQ部署 ...
- java虚拟内存设置 防止内存溢出 OutOfMemory【转】【原】
outofmemory permgen 这个问题主要还是由 java.lang.OutOfMemoryError: Java heap space 引起的. 有这两种解决方法: 1.设置环境变量 解决 ...
- 浅谈分词算法(5)基于字的分词方法(bi-LSTM)
目录 前言 目录 循环神经网络 基于LSTM的分词 Embedding 数据预处理 模型 如何添加用户词典 前言 很早便规划的浅谈分词算法,总共分为了五个部分,想聊聊自己在各种场景中使用到的分词方法做 ...
- DotNetBar TreeGx用法
添加一个节点和4个子节点treeGXHelp.Nodes[].Text = textBoxDropDownHelp.Text + "的主题"; treeGXHelp.Nodes[] ...
- FastReport 套打全攻略
http://blog.csdn.net/jinzhili/article/details/500263 FastReport 套打全攻略 2005-7-13 22:10 原创//以设计套打行为6 ...
- Selenium自动化Page模式(Python)
Selenium是当前主流的web自动化工具,提供了多种浏览器的支持(Chrome,Firefox, IE等等),当然大家也可以用自己喜欢的语言(Java,C#,Python等)来写用例,很容易上手. ...
- CSS之清除浮动(span/clearfix)
一.问题描述 web网页设计中,在div元素中有时候常伴有图文结合的post组件.为了使得文本在图像周围环绕,那么需要对图像区域使用float浮动.如果不做清除浮动,则会出现如下结果: 图像比文本高, ...
- 阿里云3台机器组成集群配置ssh免密码登陆
1 查询阿里云局网ip 注意:需要配置同一地区同一可用区的机器 才是一个局网 2 配置好hosts文件 3 hostname确认也是正确的 4 生成公钥私钥 三台机器同样操作 ssh-keygen - ...