const { resolve } = require('path')

const HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {

  entry: resolve(__dirname, 'src/js/index.js'),

  output: {

    filename: 'js/built.js',

    path: resolve(__dirname, 'build')

  },

  plugins: [

    new HtmlWebpackPlugin({

      template: resolve(__dirname, 'src/index.html')

    })

  ],

  mode: 'production',

  externals: {

    // 拒绝jQuery被打包进来

    jquery: 'jQuery'

  }

}

手动引入jquery

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>webpack</title>

  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/2.2.4/jquery.js"></script>

</head>

<body>

  <h1 id="title">hello html</h1>

</body>

</html>

30-externals（拒绝某些包被打包进来）的更多相关文章

  1. 【grunt第二弹】30分钟学会使用grunt打包前端代码（02）

    前言 上一篇博客,我们简单的介绍了grunt的使用,一些基础点没能覆盖,我们今天有必要看看一些基础知识 [grunt第一弹]30分钟学会使用grunt打包前端代码 配置任务/grunt.initCon ...

  2. 【grunt整合版】30分钟学会使用grunt打包前端代码

    grunt 是一套前端自动化工具,一个基于nodeJs的命令行工具,一般用于:① 压缩文件② 合并文件③ 简单语法检查 对于其他用法,我还不太清楚,我们这里简单介绍下grunt的压缩.合并文件,初学, ...

  3. 【grunt第一弹】30分钟学会使用grunt打包前端代码

    前言 以现在前端js激增的态势,一个项目下来几十个js文件轻轻松松对于复杂一点的单页应用来说,文件上百简直是家常便饭,那么这个时候我们的js文件应该怎么处理呢?另外,对于css文件,又该如何处理呢?? ...

  4. 30天轻松学习javaweb_打包web项目成war

    jar -cvf news.war news 打包成 war 包后复制到webapps下,Tomcat将会解压.

  5. 【grunt整合版】 30分钟学会使用grunt打包前端代码

    grunt 是一套前端自动化工具,一个基于nodeJs的命令行工具,一般用于:① 压缩文件② 合并文件③ 简单语法检查 对于其他用法,我还不太清楚,我们这里简单介绍下grunt的压缩.合并文件,初学, ...

  6. 30分钟学会使用grunt打包前端代码【mark】

    grunt 是一套前端自动化工具,一个基于nodeJs的命令行工具,一般用于:① 压缩文件② 合并文件③ 简单语法检查 对于其他用法,我还不太清楚,我们这里简单介绍下grunt的压缩.合并文件,初学, ...

  7. 30分钟学会使用grunt打包前端代码

    http://www.cnblogs.com/yexiaochai/p/3603389.html

  8. 【英语】Bingo口语笔记(30) - 表示“拒绝”

  9. webpack--性能优化之打包构建速度和代码调试优化

    前言 本文来总结写webpack 在性能方面常见的优化方案. 正文 本文分别总结开发环境和生产环境中在打包构建速度和代码调试功能方面的优化方案,如下: 1.开发环境性能优化 (1)优化打包构建速度 a ...

  10. Webpack打包进阶

    说在前面 由于使用了React直出,页面各项性能指标使人悦目.本篇将深入探讨目前PC部落所采用webpack打包优化策略,以及探讨PC部落并未使用的 webpack Code Splitting 代码 ...

随机推荐

  1. 关于TIdTCPClient的几种方法

    关于TIdTCPClient的几种方法 收藏  其实Indy比较简单,但是可以提供的方法太多了.我找了很久,才搞明白. 比方说这个读取缓冲区的数据,就有很多种方法.相对于TTcpClient的几种方法 ...

  2. C语言转义序列

    转义序列 含义 \a 报警(ANSIC) \b 退格 \f 换页 \n 换行 \r 回车 \t 水平制表符 \v 垂直制表符 \\ 反斜杆\ \' 单引号 \" 双引号 \? 问号 \0oo ...

  3. C# 图片 等 文件 读取操作 的一点提示

    源于:在读取图片时,总喜欢首先采用:Image img=Image.FromFile("");操作,这种方式由于 调用图片的程序与图片文件是通过 绝对地址关联的,会造成 当前进程或 ...

  4. java 循环删除数据写法

    import java.util.ArrayList;import java.util.ConcurrentModificationException;import java.util.List;// ...

  5. 在VMWare里安装Win11虚机

    1. 安装win11有最低硬件要求 64位CPU双核,内存4G,硬盘64G,受信任的平台模块(TPM)2.0,支持UEFI安全启动 2. VMware新建虚机的设置 1)创建64位虚拟机,CPU设置为 ...

  6. SDN实验环境配置

  7. 一分钟教你分清各种光纤跳线接头（SC、ST、FC、LC、MPO）

    一分钟教你分清各种光纤跳线接头(SC.ST.FC.LC.MPO)  市场上常见的光纤跳线有以下几种接头:SC.ST.FC.LC.MPO,相信很多入门者和小编一样,面对各种英文缩写也是我只认识他们,却不 ...

  8. 9. 实现包括前端后台的预约洗狗功能 - 使用Power App处理预约信息 - 创建Power Canvas App并实现基础功能

    ​ Power Canvas App可以通过画布设计和构建业务应用,无需通过传统编写代码的形式来构建,通过将元素拖动到画布上来设计我们的Power Canvas APP,可以与Miceosoft和第三 ...

  9. sql处理重复的列，更好理清分组和分区

    一.分组统计.分区排名 1.语法和含义: 如果查询结果看得有疑惑,看第二部分-sql处理重复的列,更好理清分组和分区,有建表插入数据的sql语句 分组统计:GROUP BY 结合 统计/聚合函数一起使 ...

  10. DSC：数仓SQL脚本迁移的神奇工具

    摘要:本文介绍的DSC工具是针对数据库切换时面临的迁移任务而开发的免安装命令行工具.目的是提供简单.快速.可靠的SQL脚本迁移服务. 本文分享自华为云社区<GaussDB(DWS)DSC工具系列 ...