webpack的核心概念(四个)

  • 入口(entry)
  • 输出(output)
  • loader
  • 插件(plugins)

Entry(入口)——指示 webpack 应该使用哪个模块,来作为构建其内部依赖图的开始。代码的入口,打包的入口,一个或多个,可以通过代码的入口找到他依赖的模块或者间接找到

module.exports = {
entry:{
    index:'index.js'
  }
}

output(出口)—— 告诉 webpack 在哪里输出它所创建的 bundles,以及如何命名这些文件打包生成的文件(bundle) 一个或多个 自定义规则

module。exports = {
entry:{
index:'index.js',
vendor:'vendor.js'
},
output:{
filename:'[name].min.[hash:5].js'
}
}

loader------让 webpack 能够去处理那些非 JavaScript 文件(webpack 自身只理解 JavaScript) loader 可以将所有类型的文件转换为 webpack 能够处理的有效模块,然后你就可以利用 webpack 的打包能力,对它们进行处理。

plugins 参与打包整个过程 打包优化和也锁 配置编译时的变量等,非常灵活

webpack前期了解的更多相关文章

  1. 学习 React(jsx语法) + es2015 + babel + webpack

    视频学习地址: http://www.jtthink.com/course/play/575 官方地址 https://facebook.github.io/react/ 神坑: 1.每次this.s ...

  2. webpack配合vue.js实现完整的单页面demo

    本篇文章主要是我在开发前研究了webpack+vue.js的单页面应用,因为需要用到node的npm,所以确保安装了node,建议官网安装最新的稳定版本.并且在项目中需要加载一些npm包,由于npm的 ...

  3. CSS预编译与PostCSS以及Webpack构建CSS综合方案

    CSS全称Cascading Style Sheets(层叠样式表),用来为HTML添加样式,本质上是一种标记类语言.CSS前期发展非常迅速,1994年哈肯·维姆·莱首次提出CSS,1996年12月W ...

  4. 《前端之路》之 webpack 4.0+ 的应用构建

    目录 一.版本 二.webpack 的主体概念 2-1.入口 2-1-1.单页面入口 2-1-2.多页面应用的入口 2-2.输出 2-3.loader 2-4.plugins 三.如何使用 3-1 关 ...

  5. 前端笔记之ES678&Webpack&Babel(下)AMD|CMD规范&模块&webpack&Promise对象&Generator函数

    一.AMD和CMD规范(了解) 1.1传统的前端开发多个js文件的关系 yuan.js中定义了一个函数 function mianji(r){ return 3.14 * r * r } main.j ...

  6. Vue2+VueRouter2+webpack 构建项目实战(二):目录以及文件结构

    通过上一篇博文<Vue2+VueRouter2+webpack 构建项目实战(一):准备工作>,我们已经新建好了一个基于vue+webpack的项目.本篇文章详细介绍下项目的结构. 项目目 ...

  7. 纯webpack打包项目

    webpack 3 零基础入门教程 http://webpackbook.rails365.net/466996(文本) https://www.rails365.net/movies/webpack ...

  8. 真刀实战地搭建React+Webpack+Express搭建一个简易聊天室

    一.前面bb两句 因为自惭(自残)webpack配置还不够熟悉,想折腾着做一个小实例熟悉.想着七夕快到了,做一个聊天室自己和自己聊天吧哈哈.好了,可以停止bb了,说一下干货. 二. 这个项目能学到啥? ...

  9. 基于Vue + webpack + Vue-cli 实现分环境打包项目

    需求由来:我公司项目上线发布至服务器分为三个环境分别为测试环境.预发布环境.生产环境:前期做法是项目通过脚步打包时由脚步把域名和后缀名之类的全部替换成要发布的环境所需要的,因为我公司的项目比较大由许许 ...

随机推荐

  1. 【原创】(十一)Linux内存管理slub分配器

    背景 Read the fucking source code! --By 鲁迅 A picture is worth a thousand words. --By 高尔基 说明: Kernel版本: ...

  2. HTTP,HTTPS,HTTP2笔记

    HTTP 网络协议分层 应用层 -> HTTP FTP 为应用软件提供了很多服务 构建于TCP协议之上 屏蔽网络传输的相关细节 传输层 -> TCP UDP 向用户提供可靠的端对端的服务( ...

  3. [ubuntu篇] 使用Hexo建立个人博客,自定义域名https加密,搜索引擎google,baidu,360收录

    为了更好的阅读体验,欢迎阅读原文.原文链接在此. Part 1: Using Github Pages and Hexo to manage personal blogs. Series Part 1 ...

  4. postgresql12 b-tree v4空间上和性能上的优化

    在 pg v11 和 v12 上 常见测试用例 CREATE TABLE rel ( a bigint NOT NULL, b bigint NOT NULL ); ALTER TABLE rel A ...

  5. 三维目标检测论文阅读:Deep Continuous Fusion for Multi-Sensor 3D Object Detection

    题目:Deep Continuous Fusion for Multi-Sensor 3D Object Detection 来自:Uber: Ming Liang Note: 没有代码,主要看思想吧 ...

  6. 【NHOI2018】扑克游戏

    [问题描述] 有一种别样“小猫钓鱼”扑克游戏.有 N 张牌,每张牌都有一个花色和点数.游戏的规则:扑克接龙时,若前面有同样花色的牌,你可以将这两张牌连同之间的牌都取走,得到的分值为取走牌点数之和.这里 ...

  7. 记一次uboot中gunzip解压速度慢的问题排查

    背景 在项目中需要用到解压功能,之前还记录了下,将uboot解压代码移植到另外的bootloader中时,碰到的效率问题.最终查明是cache的配置导致的. https://www.cnblogs.c ...

  8. Linux -- 进程管理之僵尸进程

    UNIX 存在一种机制:在每个进程退出的同时,操作系统释放该进程所有资源,但仍然保留一定的信息(PID / Status / runtime),直到父进程执行 wait() / waitpid(),以 ...

  9. 09-kubernetes StatefulSet

    目录 StatefulSet 简单测试 使用 StatefulSet 创建基础的PV StatefulSet 清单 StatefulSet 有状态应用副本集 无状态的, 更关注的是群体 有状态的, 更 ...

  10. VS #region

    1.C# 预处理指令 #region使您得以在使用Visual Studio代码编辑器的大纲显示功能时指定可展开或折叠的代码块.    #region   name    其中:name      希 ...