有时候我们不想bundle.js过于大,想把一些库独立成文件单独拿出来

module.exports = {
entry: {
  // bundle是我们要打包的项目文件的导出名字, app是入口js文件
  bundle: 'app',
  // vendor就是我们要打包的第三方库最终生成的文件名,数组里是要打包哪些第三方库, 如果不是在node——modules里面,可以填写库的具体地址
  vendor:['jquery','vue']
},
plugins: {
  // 这里实例化webpack.optimize.CommonsChunkPlugin构造函数
  // 打包之后就生成vendor.js文件
  new webpack.optimize.CommonsChunkPlugin({
name: 'vendor'
})
}
}

webpack提取库的更多相关文章

  1. webpack提取公共js代码

    webpack打包js代码与提取公共js代码分析 webpack提取公共js代码示例 一.分析 webpack默认打包js代码时,是将从入口js模块开始,将入口js模块所依赖的js以及模块逐层依赖的模 ...

  2. webpack提取图片文件打包压缩

    抽离图片文件打包到指定路径下 压缩抽离的图片资源 配置生成html中的图片路径 一.准备测试环境 //工作区间 src//文件夹 index.js//入口文件 index.css//样式文件 inde ...

  3. webpack 提取css成单独文件

    webpack 提取css成单独文件 // 用来拼接绝对路径的方法 const {resolve} = require('path') const HtmlWebpackPlugin = requir ...

  4. vue-cli、webpack提取第三方库-----DllPlugin、DllReferencePlugin

    需要安装的插件有 extract-text-webpack-plugin assets-webpack-plugin clean-webpack-plugin npm install extract- ...

  5. webpack 插件库

    webpack常用的插件安装命令 webpack常用的插件安装命令:1:npm install html-webpack-plugin --save-dev //自动快速的帮我们生成HTML.2:np ...

  6. webpack 提取 manifest 文件

    当 webpack 生成 bundle 时, 它同时维护一个 manifest 文件.你可以在生成的 vendor bundle 中找到它.manifest 文件描述了哪些文件需要 webpack 加 ...

  7. 使用 webpack-bundle-analyzer 分析 webpack 代码库拆分块

    github:https://github.com/webpack-contrib/webpack-bundle-analyzer 1.安装: cnpm install webpack-bundle- ...

  8. webpack学习笔记--提取公共代码

    为什么需要提取公共代码 大型网站通常会由多个页面组成,每个页面都是一个独立的单页应用. 但由于所有页面都采用同样的技术栈,以及使用同一套样式代码,这导致这些页面之间有很多相同的代码. 如果每个页面的代 ...

  9. vue-cli3 DllPlugin 提取公用库

    vue 开发过程中,保存一次就会编译一次,如果能够减少编译的时间,哪怕是一丁点,也能节省不少时间.开发过程中个人编写的源文件才会频繁变动,而一些库文件我们一般是不会去改动的.如果能把这些库文件提取出来 ...

随机推荐

  1. 关于KMP

    KMP算法,对于求b串在a串中出现的次数. 在学习KMP之前,希望大家充分掌握hash. HASH: 1.hash表:用来离散化(hash数组,hash链表) 2.Rabin-Kap算法: 可替代KM ...

  2. Eclipse中Maven插件配置

    1. Maven插件配置 http://www.blogjava.net/fancydeepin/archive/2012/07/13/eclipse_maven3_plugin.html 2. Ma ...

  3. Qt控件使用汇总

    QTableWidget: //tab居中显示 QTabWidget::tab-bar { alignment: center; } //tab边框样式,边框颜色,前景色 QTabBar::tab { ...

  4. 部署AlwaysOn第二步:配置AlwaysOn,创建可用性组

    AlwaysOn是在SQL Server 2012中新引入的一种高可用技术,从名称中可以看出,AlwaysOn的设计目标是保持数据库系统永远可用.AlwaysOn利用了Windows服务器故障转移集群 ...

  5. Tkernel Package NCollection哈希基础的类

    OpenCASCADE内用到了很多由诸如NCollection_Map, NCollection_DataMap, NCollection_DoubleMap, NCollection_Indexed ...

  6. Mac OS系统 sublime text3 常用快捷键记录

    个人觉得下面这些个常用的快捷键,还是有必要熟练使用的: 符号说明: ⌘:command ⌃:control ⌥:option ⇧:shift ↩:enter ⌫:delete cmd+n 新建文件(n ...

  7. LeetCode 617. Merge Two Binary Trees合并二叉树 (C++)

    题目: Given two binary trees and imagine that when you put one of them to cover the other, some nodes ...

  8. Design and Implementation of a Routing Control Platform阅读笔记

    Design and Implementation of a Routing Control Platform   0.Abstract 1.Introduction 2.Interoperating ...

  9. 从零开始学Kotlin-数据类型(2)

    从零开始学Kotlin基础篇系列文章 基本数据类型 Kotlin 的基本数值类型包括 Byte.Short.Int.Long.Float.Double 等: 数据-------位宽度 Double-- ...

  10. final 140字评论I

    1.约跑app:优化了最终界面,设备原因画质不是很清晰,如果能加以改进,能有较多的客户群,适合人群不限于青少年和成年人. 2.礼物挑选:虽然界面不是很清晰,但是整体设计看起来还算舒服,最后阶段又新增了 ...