JAVA高级面试进阶训练营视频教程

admin · 发表于 2021-6-13 09:15:53

转载

原文地址：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")
}

		自动登录	找回密码
密码			立即注册

JAVA高级面试进阶训练营视频教程	Java架构师系统进阶VIP课程	分布式高可用全栈开发微服务教程	Go语言视频零基础入门到精通	Java架构师3期(课件+源码)
Java开发全终端实战租房项目视频教程	SpringBoot2.X入门到高级使用教程	大数据培训第六期全套视频教程	深度学习（CNN RNN GAN）算法原理	Java亿级流量电商系统视频教程
互联网架构师视频教程	年薪50万Spark2.0从入门到精通	年薪50万！人工智能学习路线教程	年薪50万大数据入门到精通学习路线	年薪50万机器学习入门到精通教程
仿小米商城类app和小程序视频教程	深度学习数据分析基础到实战	最新黑马javaEE2.1就业课程	从 0到JVM实战高手教程	MySQL入门到精通教程

JAVA高级面试进阶训练营视频教程

Java架构师系统进阶VIP课程

解决html中引用webpack打包后的js无法执行问题

二、原因

方法一、提升作用域：