一、第一种打包方式 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. 十一、java线程

    目录: 一.线程的基本概念 二.线程的创建和启动 三.线程的调度和优先级 四.线程的状态控制 五.线程同步 一.线程的基本概念 线程是一个程序内部的顺序控制流 线程和进程的区别: 每个进程都由独立的代 ...

  2. js模块化的两种规范AMD和CMD

    AMD 规范在这里:https://github.com/amdjs/amdjs-api/wiki/AMDCMD 规范在这里:https://github.com/seajs/seajs/issues ...

  3. 学习windows编程 day3 之 自定义画笔的两种方法

    LRESULT CALLBACK WndProc(HWND hwnd, UINT message, WPARAM wParam, LPARAM lParam) { HDC hdc; PAINTSTRU ...

  4. UVA - 12487 Midnight Cowboy（LCA+思维）

    https://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem& ...

  5. awk词频统计功能

    [root@test88 ~]# vim word_freq.sh #!/bin/bash if [ $# -ne 1 ];then echo "Usage: $0 filename&quo ...

  6. luogu P4161 [SCOI2009]游戏

    传送门 我们发现整个大置换中,会由若干形如\((a_1\rightarrow a_2,a_2\rightarrow a_3,...a_{n-1}\rightarrow a_n,a_n\rightarr ...

  7. 第4月第10天 iOS项目 mvc

    1. 一个uiviewcontroller发送网络请求,解析数据后放在数组里.如果是多个网络请求,就要多个成员变量存储.那是不是可以单独出一个model来解析数据,存储数据呢. 如果有一个Reques ...

  8. B. Light It Up

    题目链接:http://codeforces.com/problemset/problem/1000/B 代码: #include<iostream> #include<cstrin ...

  9. 【逆向工具】使用x64dbg+spy去除WinRAR5.40(64位)广告弹框

    1 学习目标 WinRAR5.40(64位)的弹框广告去除,由于我的系统为x64版本,所以安装了WinRAR(x64)版本. OD无法调试64位的程序,可以让我熟悉x64dbg进行调试的界面. 其次是 ...

  10. matplotlib 画图

    matplotlib 画图 1. 画曲线图       Tompson = np.array([0, 0, 0, 0, 0.011, 0.051, 0.15, 0.251, 0.35, 0.44, 0 ...