前端工程化-webpack(打包JS)(二)

一、第一种打包方式 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)(二)的更多相关文章
- 前端工程化 Webpack基础
前端工程化 模块化 (js模块化,css模块化,其他资源模块化) 组件化 (复用现有的UI结构.样式.行为) 规范化 (目录结构的划分.编码规范化.接口规范化.文档规范化.Git分支管理) 自动化 ( ...
- 使用webpack打包js文件(隔行变色案例)
使用webpack打包js文件(隔行变色案例) 1.webpack安装的两种方式 运行npm i webpack -g全局安装webpack,这样就能在全局使用webpack的命令 在项目根目录中运行 ...
- 前端小白webpack学习(二)
前一篇写了自我总结的webpack定义:为JavaScript服务的静态模块打包器 和几大基本概念 entry.output.plugins.loaders等.指路前端小白webpack学习(一) 下 ...
- webpack打包js文件
当输入 webpack 输入指令 npm run dev 后会自动启动一个浏览器 需要借鉴插件 open-browser-webpack-plugin 下载:npm install open-bro ...
- 27、前端知识点--webpack面试题(二)
webpack面试题总结 本文主要是对webpack面试会常被问到的问题做一些总结,且文章会不断持续更新 1.webpack打包原理 把所有依赖打包成一个 bundle.js 文件,通过代码分割成单元 ...
- webpack 打包js和css
首先进行全局安装webpack npm install -g webpackcmd跳转到项目的文件夹,安装webpack npm install --save-dev webpack接着需要packj ...
- 前端工程化webpack(一)
webpack 的基本用法 1.app.js 引入模块 import moduleLog from './module.js' //引入moduleLog从./module.js 2.module ...
- webpack——打包JS
1.在文件中打开命令行,输入code ./ (我的编译器是vs code) 2.然后会弹出编译器,在编译器内新建js文件app,sum app.js import sum from './sum ...
- webpack打包js,css和图片
1.webpack打包默认配置文件webpack.config.js 2.打包js文件:有这个文件并配置可以直接在cmd上webpack打包,没有这个文件要在cmd上输入 webpack main.j ...
随机推荐
- Java设计模式--缺省适配器模式
我认为这个模式比较常见,还记得我们学习Swing的时候吗,有没有见过很多Adapter?那时候不知道Adapter的意义所在,但至少知道他能够省去我们不需要的实现. 这个社会有N中职业(job),但是 ...
- poj 3320(尺取法)
传送门:Problem 3320 参考资料: [1]:挑战程序设计竞赛 题意: 一本书有 P 页,每页都有个知识点a[i],知识点可能重复,求包含所有知识点的最少的页数. 题解: 相关说明: 设以a[ ...
- 最短路算法模板--SPFA
初见SPFA时,直接认成了优先队列优化的Dijkstra,经过几位大佬的指点,我终于明白了他们的差异. Dijkstra是保证已经出队过的点不再入队,SPFA是已经在队列中不再入队.比较起来,SPFA ...
- 移动端自动化测试-Windows-Android-Appium环境搭建
1.安装JDK,并且配置好[JAVA_HOME]和[path]两个环境变量 1.1.JAVA_HOME:指向JDK的安装路径(如:C:\Program Files (x86)\Java\jdk1.7. ...
- Math对象小笔记
来,总结下Math对象的常用方法和属性 1.E 自然对数的底数 Math.E; //2.718281828459045 2.PI 圆周率 Math.PI; //3.141592653589793 3 ...
- mac安装神器brew
安装方法:命令行输入 /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/ma ...
- Hibernate SQL查询 addScalar()或addEntity()【转】
本文完全引用自: http://www.cnblogs.com/chenyixue/p/5601285.html Hibernate除了支持HQL查询外,还支持原生SQL查询. 对原 ...
- 挖洞姿势:特殊的上传技巧,绕过PHP图片转换实现远程代码执行(RCE)
我使用了一个特殊的图片上传技巧,绕过PHP GD库对图片的转换处理,最终成功实现了远程代码执行. 事情是这样的.当时我正在测试该网站上是否存在sql注入漏洞,不经意间我在网站个人页面发现了一个用于上传 ...
- 04-接口隔离原则(ISP)
1. 背景 类A通过接口I依赖类B,类C通过接口I依赖类D,如果接口I对于类B和类D来说不是最小接口,则类B和类D不得不去实现它们不需要的方法. 2. 定义 一个类对另一个类的依赖应该建立在最小的接口 ...
- C++字符串(srtring)反转
对称平方数 题目描述 打印所有不超过n(n<256)的,其平方具有对称性质的数.如11*11=121. 分析: 1.首先使用函数to_string将int转化为string: 2.然后将字符串反 ...