webpack官方文档分析(三):Entry Points详解
1、有很多种方法可以在webpack的配置中定义entry属性,为了解释为什么它对你有用,我们将展现有哪些方法可以配置entry属性。
2、单一条目语法
用法: entry: string|Array<string>
webpack.config.js
module.exports = {
entry: './path/to/my/entry/file.js'
};
上面的写法是下面的简写:
module.exports = {
entry: {
main: './path/to/my/entry/file.js'
}
};
当您希望为具有一个入口点的应用程序或工具(IE:库)快速设置webpack配置时,这是一个很好的选择。但是,使用此语法扩展或扩展配置的灵活性不大。
3、对象语法
用法: entry: {[entryChunkName: string]: string|Array<string>}
webpack.config.js
module.exports = {
entry: {
app: './src/app.js',
vendors: './src/vendors.js'
}
};
对象语法更详细。但是,这是在应用程序中定义条目/条目的最具扩展性的方法
4、实际中的使用方案
(1)单独的应用程序
webpack.config.js
module.exports = {
entry: {
app: './src/app.js',
vendors: './src/vendors.js'
}
};
原因:此设置允许您利用CommonsChunkPlugin
应用程序包中的任何vendor 参考并将其提取到vendor 捆绑包中,并将其替换为__webpack_require__()
调用。如果应用程序包中没有vendor 代码,那么您可以在webpack中实现一种称为长期供应商缓存的通用模式。
(2)多页面应用程序
webpack.config.js
module.exports = {
entry: {
pageOne: './src/pageOne/index.js',
pageTwo: './src/pageTwo/index.js',
pageThree: './src/pageThree/index.js'
}
};
原因:
在多页面应用程序中,服务器将为您提取新的HTML文档。该页面重新加载此新文档,并且资源已重新加载。但是,这为我们提供了做多件事的独特机会:
- 用于
CommonsChunkPlugin
在每个页面之间创建共享应用程序代码包。随着入口点数量的增加,在入口点之间重用大量代码/模块的多页面应用程序可以从这些技术中受益匪浅。
webpack官方文档分析(三):Entry Points详解的更多相关文章
- ubuntu16.04下snort的安装(官方文档安装)(图文详解)
不多说,直接上干货! 最近为了科研,需要安装和使用Snort. snort的官网 https://www.snort.org/ Snort作为一款优秀的开源主机入侵检测系统,在windows和Linu ...
- ubuntu14.04下snort的安装(官方文档安装)(图文详解)
不多说,直接上干货! 最近为了科研,需要安装和使用Snort. snort的官网 https://www.snort.org/ Snort作为一款优秀的开源主机入侵检测系统,在windows和Linu ...
- webpack官方文档分析(二):概念
1.概念 webpack的核心是将JavaScript应用程序的静态捆绑模块.当webpack处理您的应用程序时,它会在内部构建一个依赖关系图,它映射您的项目所需的每个模块并生成一个或多个包. 从版本 ...
- webpack官方文档分析(一):安装
一:安装 1.首先要安装Node.js->node.js下载 2.本地安装 要安装最新版本或特定版本,运行如下: npm install --save-dev webpack npm insta ...
- webpack新手名词解释……妈妈再也不担心我看不懂webpack官方文档了
__dirname : 在任何模块文件内部,可以使用__dirname变量获取当前模块文件所在目录的完整绝对路径. path.resolve(): 方法将一系列路径或路径段解析为绝对路径. 语法: p ...
- surprise库官方文档分析(三):搭建自己的预测算法
1.基础 创建自己的预测算法非常简单:算法只不过是一个派生自AlgoBase具有estimate 方法的类.这是该方法调用的predict()方法.它接受内部用户ID,内部项ID,并返回估计评级r f ...
- webpack官方文档学习
一.webpack是什么? webpack是一款模块加载器兼打包工具,它能把各种资源,例如JS(含JSX).coffee.样式(含less/sass).图片等都作为模块来使用和处理. 二.安装 前提条 ...
- surprise库官方文档分析(一)
一:入门 1.基本用法 (1).自动交叉验证 Surprise有一套内置的 算法和数据集供您使用.在最简单的形式中,只需几行代码即可运行交叉验证程序: from surprise import SVD ...
- surprise库官方文档分析(二):使用预测算法
1.使用预测算法 Surprise提供了一堆内置算法.所有算法都派生自AlgoBase基类,其中实现了一些关键方法(例如predict,fit和test).可以在prediction_algorith ...
随机推荐
- 学生管理系统利用arrayList第二次优化
package StuManage; public class Student { private String name;//姓名 private String stuNum;//学号 privat ...
- IIS--解决64位系统IIS网站发布出现未能加载文件或程序集“...”或它的某一个依赖项。试图加载
解决64位系统IIS网站发布出现未能加载文件或程序集“...”或它的某一个依赖项.试图加载 ASP.NET MVC 项目发布的在本地IIS后,启动网站出现未能加载文件或程序集“…”或它的某一个依赖项. ...
- O061、Boot from Volume
参考https://www.cnblogs.com/CloudMan6/p/5679384.html Volume 除了可以用作Instance的数据盘,也可以作为启动盘(Bootable Vol ...
- Python算法题(一)——青蛙跳台阶
题目一(青蛙跳台阶): 一只青蛙一次可以跳上1级台阶,也可以跳上2级.求该青蛙跳上一个n级的台阶总共有多少种跳法. 分析: 假设只有一级台阶,则总共只有一种跳法: 假设有两级台阶,则总共有两种跳法: ...
- vue 项目中如何在页面刷新的状态下保留数据
1.问题:在vue项目中,刷新页面之后,我当前打开的所有菜单,都消失,我如何实现刷新之后页面仍然是刷新之前的状态 效果图: 解决方法: 使用vuex作状态管理: 将vuex里面的数据同步更新到loca ...
- 2 java开发环境的配置步骤
1 首先需要下载JDK(以java se development kit java标准版开发包) 8.0 如果只是单纯的运行java程序则只需要安装JRE(java runtime envirome ...
- 销售订单(SO)-API-给已有的销售订单增加一行
在已存在的OM订单中增加一物料: PROCEDURE insert_new_so_api(p_return_code OUT VARCHAR2, p_return_msg OUT VARCHAR2) ...
- latex公式居中环境
一般能够用到的环境是 \begin{equation} \begin{aligned} ... \end{aligned} \end{equation} 然而,这种环境用&只能够保证左对齐或者 ...
- 从 Android 源码到 apk 的编译打包流程
文中涉及到的工具所在目录:Android/sdk/build-tools.下面开始分解并逐步实现对源码的打包. 编译流程 1. 生成仅包含资源文件的 apk 包和 R.java 文件 根据资源文件和 ...
- python基础编程: 编码补充、文件操作、集合、函数参数、函数递归、二分查找、匿名函数与高阶函数
目录: 编码的补充 文件操作 集合 函数的参数 函数的递归 匿名函数与高阶函数 二分查找示例 一.编码的补充: 在python程序中,首行一般为:#-*- coding:utf-8 -*-,就是告诉p ...