转载
原文地址:https://www.jianshu.com/p/001042b2cdfc
html中引用了webpack打包后的文件index.html
<!DOCTYPE HTML> <html> <head> <script type="text/javascript" src="./dist/main.js"></script> <!-- <script type="text/javascript" src="./src/index.js"></script> --> </head> <body> <script> test(); </script> </body> </html>
被打包的js:
function test(){ alert("test") }
提示:index.html:10 Uncaught ReferenceError: test is not defined
webpack打包js后html调用js文件中的函数
二、原因
webpack的打包是基于模块来打包的,也就是说经过打包的文件代码是被打包到一个函数里,此时所有定义的变量或者方法已变成局部的。有了独立的作用域,定义变量,声明函数都不会污染全局作用域
方法一、提升作用域:
改写函数为以下方法:
window.test = function(){ alert("test") }