一、第一种打包方式 webpack entry<entry> output

假设目录结构如下：

index.html是入口文件

打包app.js为bundle.js如下

app.js

当使用amd模块规范多出了0.bundle.js,是由于amd异步加载模块，单独形成一个chunk：

二、第二种打包方式

webpack --config  webpack.conf.js

如果想要直接webpack打包，把webpack.conf.js改为webpack.config.js

配置文件[name]是entry里面的key,[hash:5]是MD5,是文件的数字指纹

前端工程化-webpack（打包JS）(二)的更多相关文章

  1. 前端工程化 Webpack基础

    前端工程化 模块化 (js模块化,css模块化,其他资源模块化) 组件化 (复用现有的UI结构.样式.行为) 规范化 (目录结构的划分.编码规范化.接口规范化.文档规范化.Git分支管理) 自动化 ( ...

  2. 使用webpack打包js文件(隔行变色案例)

    使用webpack打包js文件(隔行变色案例) 1.webpack安装的两种方式 运行npm i webpack -g全局安装webpack,这样就能在全局使用webpack的命令 在项目根目录中运行 ...

  3. 前端小白webpack学习（二）

    前一篇写了自我总结的webpack定义:为JavaScript服务的静态模块打包器 和几大基本概念 entry.output.plugins.loaders等.指路前端小白webpack学习(一) 下 ...

  4. webpack打包js文件

    当输入 webpack 输入指令 npm run dev  后会自动启动一个浏览器 需要借鉴插件 open-browser-webpack-plugin 下载:npm install open-bro ...

  5. 27、前端知识点--webpack面试题(二)

    webpack面试题总结 本文主要是对webpack面试会常被问到的问题做一些总结,且文章会不断持续更新 1.webpack打包原理 把所有依赖打包成一个 bundle.js 文件,通过代码分割成单元 ...

  6. webpack 打包js和css

    首先进行全局安装webpack npm install -g webpackcmd跳转到项目的文件夹,安装webpack npm install --save-dev webpack接着需要packj ...

  7. 前端工程化webpack（一）

    webpack 的基本用法   1.app.js 引入模块 import moduleLog from './module.js' //引入moduleLog从./module.js 2.module ...

  8. webpack——打包JS

    1.在文件中打开命令行,输入code ./    (我的编译器是vs code) 2.然后会弹出编译器,在编译器内新建js文件app,sum app.js import sum from './sum ...

  9. webpack打包js，css和图片

    1.webpack打包默认配置文件webpack.config.js 2.打包js文件:有这个文件并配置可以直接在cmd上webpack打包,没有这个文件要在cmd上输入 webpack main.j ...

随机推荐

  1. poj 1236(强连通分量分解模板题)

    传送门 题意: N(2<N<100)个学校之间有单向的网络,每个学校得到一套软件后,可以通过单向网络向周边的学校传输. 问题1:初始至少需要向多少个学校发放软件,使得网络内所有的学校最终都 ...

  2. 音乐播放和视频播放--pyglet（一）

    最近,开始学习pyglet库.通过几天的学习,深刻的体会了python第三方模块的强大.我一直想做多媒体开发,曾经尝试用C语言进行编写,但是C语言在GUI开发上难度较大,要写一个界面出来得码很多冗余的 ...

  3. 网络编程基础【day09】：解决socket粘包之大数据(七)

    本节内容 概述 linux下运行效果 sleep解决粘包 服务端插入交互解决粘包问题 一.概述 刚刚我们在window的操作系统上,很完美的解决了,大数据量的数据传输出现的问题,但是在Linux环境下 ...

  4. mysql名词解释

    什么是QPS? 单位时间内所处理的事务数 什么是TPS? 单位时间内所处理的查询数 响应时间 并发量 同时处理的查询请求的数量 什么是吞吐量?

  5. 流媒体技术学习笔记之（一）nginx+nginx-rtmp-module+ffmpeg搭建流媒体服务器

    参照网址: [1]http://blog.csdn.net/redstarofsleep/article/details/45092147 [2]HLS介绍:http://www.cnblogs.co ...

  6. webkitAnimationEnd事件与webkitTransitionEnd事件

    写一个焦点图demo,css3动画完成以后要把它隐藏掉,这里会用到css3的事件,以前没有接触过,结果查了一下发现这是一片新天地啊,而且里面还有好多坑,比如重复动画多次触发什么的.anyway,我还是 ...

  7. u-boot移植（十）---代码修改---支持nor flash

    一.问题定位 开发板重启后打印了2个提醒和一个错误,caches的提醒先不看,看看flash和nand下面的提醒,bad CRC,Using default enviroment,我们可以定位Usin ...

  8. Java EE之 Hibernate 5.x版本中SchemaExport的用法

    //hibernate 5.0.1 Final ServiceRegistry serviceRegistry = new StandardServiceRegistryBuilder().confi ...

  9. try 、catch 、finally 、throw 测试js错误

    try语句允许我们定义在执行时进行错误测试的代码块. catch 语句允许我们定义当 try 代码块发生错误时,所执行的代码块. finally 语句在 try 和 catch 之后无论有无异常都会执 ...

  10. NMS和soft-nms算法

    非极大值抑制算法(nms) 1. 算法原理 非极大值抑制算法(Non-maximum suppression, NMS)的本质是搜索局部极大值,抑制非极大值元素. 2. 3邻域情况下NMS的实现 3邻 ...