Angular中出现Uncaught ReferenceError: $ is not defined错误求助

嘿，这个问题我之前也碰到过！核心原因其实很简单——你在angular.cli.json的scripts数组里把依赖jQuery的auth.js放在了jQuery本身的前面！脚本是按照数组顺序依次加载执行的，当auth.js运行时，jQuery还没被加载完成，自然找不到$变量。

下面给你两个关键的解决方案：

1. 调整脚本加载顺序（最关键） #

把jQuery的脚本放在auth.js前面，确保依赖的库先被加载：

"scripts": [
  "../../node_modules/jquery/dist/jquery.min.js",
  "../src/assets/js/auth.js"
]

这样当auth.js执行时，jQuery已经挂载到全局环境，$就能正常被识别了。

2. 显式从全局对象获取jQuery（可选保险措施） #

有时候即使顺序正确，也可能因为作用域的细微问题导致$无法访问，你可以在auth.js的最顶部加上这段代码，强制从window对象获取jQuery实例：

// 确保auth.js能拿到全局的jQuery
const $ = window.jQuery || window.$;

这样就彻底避免了作用域带来的变量找不到问题。

另外补充一点：你在app.component.ts里通过import * as $ from 'jquery'导入的jQuery，是组件模块内部的局部变量，和外部auth.js运行的全局环境无关，所以这个导入不会帮到外部JS文件哦。

内容的提问来源于stack exchange，提问作者Sta-Dev