<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
/>
<title>Ant Design Pro</title>
<link rel="icon" href="/favicon.png" type="image/x-icon" />
<!-- 引入对应包的cdn -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script src="https://gw.alipayobjects.com/os/antv/pkg/_antv.g2-3.5.0/dist/g2.min.js"></script>
</head>
<body>
<noscript>Sorry, we need js to run correctly!</noscript>
<div id="root"></div>
</body>
</html>
export default {
...,
output: {
libraryTarget: 'umd',
},
<!--配置externals 将需要忽略打包的都写在这个里面,但前提是index.html文件里面必须script引入-->
externals: {
// 后面是原本使用的全局变量名,前面的是引入的包名(就是import xx from 'moment'),然后我们实际写代码时候,用的是xx这个变量名。
moment: 'moment',
'@antv/g2': 'G2',
},
// webpack就会在遇到引用moment或者@antv/g2的模块时,不将其打包入bundle.js中。所以moment或@antv/g2代表的是模块名,一定不能写错。模块名参照package.json中的包的名称
...
};