
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
-
这样我们的方法就可以被调用了
文章均来自互联网如有不妥请联系作者删除QQ:314111741 地址:http://www.mqs.net/post/14943.html
添加新评论