一、第一种打包方式 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. TCP协议、UDP协议、端口、套接字

    TCP协议优缺点 可靠:反馈数据是否送达 效率低:需要创建连接请求,连接成功后发数据 UDP协议优缺点 不可靠:无任何反馈 效率高:不创建连接请求,直接发数据 端口(0~65535,其中0~1023用 ...

  2. Docker mysql主主互备和高可用

    一.测试环境 1.1 结构图 1.2 版本 操作系统:CentOS 7.3 MySQL版本:5.6.35 Docker版本:18.06.1-ce 使用root用户操作 IP地址说明 IP地址 用途 备 ...

  3. Java ExecutorService四种线程池的例子与说明

    1.new Thread的弊端 执行一个异步任务你还只是如下new Thread吗? new Thread(new Runnable() { @Override public void run() { ...

  4. ​python高级数据可视化视频Dash1

    在谷歌浏览器输入http://127.0.0.1:8050/后,回车,看到下图可视化结果 # -*- coding: utf-8 -*- """ Created on S ...

  5. 网络编程基础【day10】：IO多路复用

    这些名词比较绕口,理解涵义就好.一个epoll场景:一个酒吧服务员(一个线程),前面趴了一群醉汉,突然一个吼一声“倒酒”(事件),你小跑过去给他倒一杯,然后随他去吧,突然又一个要倒酒,你又过去倒上,就 ...

  6. JVM总结（二）：垃圾回收器

    这一节我们来总结一下JVM垃圾收集器方面的东西. 垃圾回收器 判断对象引用是否失效 对象生存判断算法 引用判断过程 垃圾收集算法简介 垃圾收集器 新生代垃圾收集器 老年代垃圾收集器 新生代和老年代垃圾 ...

  7. js中闭包的概念和用法

    闭包:主要的作用是 封装变量,收敛权限.防止变量被污染.比如Jquery框架就运用了大量的闭包.为什么呢? 问个问题?框架是如何来避免你声明的变量和它自带的变量不发生的冲突的?????很明显,需要闭包 ...

  8. 浅谈分词算法（5）基于字的分词方法（bi-LSTM）

    目录 前言 目录 循环神经网络 基于LSTM的分词 Embedding 数据预处理 模型 如何添加用户词典 前言 很早便规划的浅谈分词算法,总共分为了五个部分,想聊聊自己在各种场景中使用到的分词方法做 ...

  9. 在O(N)时间内求解 正数数组中 两个数相加的 最大值

    一,问题描述 给定一个正数数组arr(即数组元素全是正数),找出该数组中,两个元素相加的最大值,其中被加数的下标大于加数的下标.由加法运算的可逆性,j >i 这个条件可以去掉. 即求出: max ...

  10. luogu P1600 天天爱跑步

    传送门 1A此题暴祭 (下面记点\(x\)深度为\(de_x\),某个时间点记为\(w_x\)) 首先,每条路径是可以拆成往上和往下两条路径的 对于往上的路径,假设有个人往上跑,\(w_y\)在点\( ...