image.png
-
上面的图片是我的项目目录及简单的进行webpack的配置和打包后的目录dist和js文件
-
第一种就是使用配置的webpack进行打包，输入指令
npx webpack
-
打包成功后，会生成一个dist文件夹及js文件
-
第二种就是配置打包的命令就OK了
image.png
-
直接输入 npm run build就可以了
-
接下来看看我们打包的js文件，直接看最底部
image.png
-
箭头指向的方向就是我们封装的js文件中的方法，注意了：前方高能，在我们封装的js文件中，一般不要写成function add(){}等这种方法，要写成全局的那种
image.png
-
因为webpack打包后是一个自执行函数，百度上有人说可以使用window.方法名=function(){}，来提升作用域，但是我可能是有点小垃圾，没弄出来，最后选择了这种全局的方法
-
在html页面中进行引入我们压缩后的文件，注意我配置的是绝对路径，所以要看看你的路径引入对不对了
image.png
-
这样我们的方法就可以被调用了
