轉載
原文地址: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") }