当我们执行npm run bundle的时候输出了很多信息,那么这些信息都是什么意思呢
Hash: 221e7fd2e8bf82149df7
Version: webpack 4.30.0
Time: 141ms
Built at: 2019-04-15 06:37:26
Asset Size Chunks Chunk Names
bundle.js 1.38 KiB 0 [emitted] main
Entrypoint main = bundle.js
[0] ./src/index.js 159 bytes {0} [built]
[1] ./src/header.js 203 bytes {0} [built]
[2] ./src/sidebar.js 210 bytes {0} [built]
[3] ./src/content.js 209 bytes {0} [built]
Hash:代表本次打包唯一一个hash值。
version,这次使用的webpack打包版本是4.30.0这个版本
time:当前包整体打包耗时
asset:这个字段下面是bundle.js,他表示的是,我们打包出了一个bundle.js文件。
size: 表示这个文件大小是1.38kb
chunks: 打包文件的id,现在只有一个bundle.js打包文件,有多个的时候,会有多个不同的chunk
Chunk Names: 打包文件的名字。
这个main是怎么来的,配置文件里面并没有这个main,实际上
entry: './src/index.js',
是
entry: {
main: './src/index.js'
},
的简写。

浅析webpack打包输出内容的更多相关文章

  1. 使用webpack打包ThinkPHP的资源文件

    使用webpack打包ThinkPHP的资源文件 利用自己的空余时间一直在维护http://www.wx2share.com这个小网站,全是一个人在弄,由于只租得起虚拟空间,所以后台采用了简单方便的T ...

  2. Webpack打包进阶

    说在前面 由于使用了React直出,页面各项性能指标使人悦目.本篇将深入探讨目前PC部落所采用webpack打包优化策略,以及探讨PC部落并未使用的 webpack Code Splitting 代码 ...

  3. Webpack打包构建太慢了?试试几个方法

    Webpack是个很流行的打包工具,但其打包速度却一直被吐槽着 如果不用上一些打包的优化建议,单单打包两三个文件就能花上好几秒,放上几十个入口文件依赖几百上千个包的话,几分钟十几分钟妥妥的 本文整理了 ...

  4. vue-cli+webpack打包配置

    vue-cli+webpack打包配置 一: 目录结构: ├── README.md ├── build │ ├── build.js │ ├── check-versions.js │ ├── ut ...

  5. 零基础学习webpack打包管理

    这些天在项目之余的时间学习了webpack打包项目的东西,非常荣幸的找到一些大神的文章来学习,死劲嚼了几天,终于略知一二.在以后的工作上还需继续学习,下面我将分享我这几天学到的一点东西,希望能让我一个 ...

  6. webpack打包理解

    webpack打包理解(将所有依赖文件打包到一个文件中) 由于前端代码变得越来越多,越来越复杂, 纯粹脚本化的代码书写方式已经不能满足工程化得需求. 前端模块被抽象出来, 不仅仅包括js模块, 其它如 ...

  7. webpack打包优化之外部扩展externals的实际应用

    目录 前言 externals定义 用法 string array object function regex 实际案例 打包时间 打包之后包的大小 浏览器加载 需要注意 参考 前言 使用vue-cl ...

  8. webpack打包和gulp打包工具详细教程

    30分钟手把手教你学webpack实战 阅读目录 一:什么是webpack? 他有什么优点? 二:如何安装和配置 三:理解webpack加载器 四:理解less-loader加载器的使用 五:理解ba ...

  9. webpack打包经验——处理打包文件体积过大的问题

    前言 最近对一个比较老的公司项目做了一次优化,处理的主要是webpack打包文件体积过大的问题. 这里就写一下对于webpack打包优化的一些经验. 主要分为以下几个方面: 去掉开发环境下的配置 Ex ...

随机推荐

  1. redis(4)事务

    一.事务 一般来说,事务必须满足4个条件,也就是我们常说的ACID: 1)Atomicity 原子性:一个事务中的所有操作要么全部完成,要么全部不完成,不会结束在中间的某个环节.事务在执行过程中发生错 ...

  2. tsung

    要做针对mongodb的压力测试,下了个tsung,看看他的策略是什么,目前定位ts_launcher.erl:do_launch({Intensity, MyHostName, PhaseId})- ...

  3. AtomicInteger关键字

    validate 关键字可以保证多线程之间的可见性,但是不能保证原子操作.(需要了解java内存模型jmm) package com.cn.test.thread; public class Vola ...

  4. flask用session记录状态

    html <form action="/login" method="POST"> <input type="text" ...

  5. CSS3之盒模型

    1. 什么是盒模型? css中的每个元素都是一个盒模型, 包括html body元素, 浏览器解析css的时候也会把每个元素看成一个盒子来解析. 盒模型具备的属性(存在的特点)有: content ( ...

  6. Python入门-装饰器初始

    今天我们就围绕一个来展开,那就是:装饰器 一.装饰器 在说装饰器之前,我们先说一个软件设计的原则:开闭原则,又被称为开放封闭原则,你的代码对功能的扩展是开放的,你的程序对修改源代码是封闭的,这样的软件 ...

  7. react+antd 选项卡切换

    index.js: import React from 'react'; import ReactDOM from 'react-dom'; import CardSecond from './Car ...

  8. Windows操作系统----锁住命令行窗口

    第一步: 新建一个.txt文档,输入如下内容: @echo off echo. setlocal :checkpassword set /p password=请输入密码: if "%pas ...

  9. 浅谈回归(二)——Regression 之历史错误翻译

    我很好奇这个问题,于是搜了一下.我发现 Regression 这个词 本意里有"衰退"的意思. 词根词缀: re- 回 , 向后 + -gress- 步 , 级 + -ion 名词 ...

  10. HTML 5篇(持续更新)

    1.sessionStorage .localStorage 和 cookie 之间的区别 (一)共同点:都是保存在浏览器端,且同源的. (二)区别:cookie数据始终在同源的http请求中携带(即 ...