一、第一种打包方式 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. ffmpeg处理视频与声音

    1.ffmpeg将mp4分解成多张jpg图片 要在游戏中播放视频,引擎竟然不支持.琢磨了一下,干脆将视频图片提取出来,然后用Animation动画类来播放这些图片,这样也能实现播放视频的效果.还是ff ...

  2. json.stringify和json.parse,序列化和反序列化

    json.stringify()是序列化函数,用于将对象转化为字符串:json.parse()是反序列化函数,用于将字符串转化为json对象 一.序列化: var o={name:'wen',age: ...

  3. pymysql 在数据库中插入空值

    1. 先搞清 ''(空字符串)和 NULL的区别 (1)本质区别: 空字符串是个值 NULL 和Python中的NULL一样,是空值的意思 (2)查询语句的区别: SELECT * FROM test ...

  4. django基础之数据库操作

    Django 自称是“最适合开发有限期的完美WEB框架”.本文参考<Django web开发指南>,快速搭建一个blog 出来,在中间涉及诸多知识点,这里不会详细说明,如果你是第一次接触D ...

  5. 20190311 Java处理JSON的常用类库

    1. Gson 1.1. 背景 谷歌 1.2. 简单使用 Gson gson = new Gson(); System.out.println(gson.toJson(1)); // ==> 1 ...

  6. JavaScript模板代码总结

    //中文input框对非中文的校验 var reg=/[^\u4E00-\u9FA5]/g; if (reg.test($("#jgqc").val())){ alert(&quo ...

  7. Python基础【day03】：文件操作（七）

    零.本节内容 1.文件常用操作汇总 2.打开文件 3.操作文件 4.关闭文件 一.文件常用操作汇总 二.打开文件 1.普通打开模式 r,英文:read,只读模式(默认) w,英文:write,只写模式 ...

  8. js中常用事件

    鼠标事件 /* onclick:点击某个对象时触发 ondblclick:双击某个对象时触发 onmouseover:鼠标移入某个元素时触发 onmouseout:鼠标移出某个元素时触发 onmous ...

  9. MySQL锁解决并发问题详解

    文章分为以下几个要点 问题描述以及解决过程 MySQL锁机制 数据库加锁分析 下面讨论的都是基于MySQL的InnoDB. 0. 问题描述以及解决过程 因为涉及到公司利益问题,所以下面很多代码和数据库 ...

  10. 复杂HTML解析

    面对页面解析难题时候,需要注意问题: 1.寻找“打印次页”的链接,或者看看网站有没有HTML样式更友好的移动版(把自己的请求头设置成处于移动设备的状态,然后接收网站移动版). 2.寻找隐藏在JavaS ...