有时候我们不想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. 蒙提霍尔游戏 python 模拟

    本文使用蒙特卡罗方法验证蒙提霍尔游戏的结论. 以下代码,本人原创! 完整代码 import random # 蒙提霍尔游戏 def play_game(strategy='nonchange'): # ...

  2. Caffe源码中common文件分析

    Caffe源码(caffe version:09868ac , date: 2015.08.15)中的一些重要头文件如caffe.hpp.blob.hpp等或者外部调用Caffe库使用时,一般都会in ...

  3. 为你的机器学习模型创建API服务

    1. 什么是API 当调包侠们训练好一个模型后,下一步要做的就是与业务开发组同学们进行代码对接,以便这些‘AI大脑’们可以顺利的被使用.然而往往要面临不同编程语言的挑战,例如很常见的是调包侠们用Pyt ...

  4. ECMAScript6——Set数据结构

    /** * 数据结构 Set */ // ----------------------------------------------------- /** * 集合的基本概念:集合是由一组无序且唯一 ...

  5. uwsgi+django架构程序内部无法获取全局变量

    近期开发了一个djangoi程序,用django自带的python manage.py runserver 0.0.0.0:80 运行方式无任何问题,但用django+nginx+uwsg部署运行有时 ...

  6. [转]申瓯 JSY2000-06 程控电话交换机呼叫转移设置

    说明:若申瓯程控电话交换机分机有事不在位置上或遇忙分机正忙时为使某些重要来话不丢失,可设置将呼入本机的电话转移至其他分机及公网固定电话或手机.电话交换机使用了本功能不管分机用户在什么地方都能接听到办公 ...

  7. 现代OpenGL渲染管线介绍

    原文摘选自 现代OpenGL渲染管线介绍 此文对最新的OpenGL做一个简单的介绍,如有理解错误,敬请指正.英文原文: https://glumpy.github.io/modern-gl.html ...

  8. Hyperledger Fabric网络节点架构

    Fabric区块链网络的组成  区块链网络结构图 区块链网络组成 组成区块链网络相关的节点 节点是区块链的通信主体,和区块链网络相关的节点有多种类型:客户端(应用).Peer节点.排序服务(Orde ...

  9. Laravel 5.6 视图用Blade语法传递变量和流程控制if 语句和循环语句

    Laravel5.6 视图用Blade语法传递变量和流程控制if 语句和循环语句 Laravel 的 View 部分是内置了两套输出系统:直接输出和使用 Blade 引擎“编译”后输出,默认情况下它们 ...

  10. io整理

    http://www.cnblogs.com/rollenholt/archive/2011/09/11/2173787.html