Angular5中index.html引入外部脚本提示NotFound的解决求助

别担心，我来帮你排查这个问题。这种情况通常是文件路径配置或者资源映射的问题，咱们一步步来解决：

1. 确认脚本文件的存放位置 #

Angular项目中，静态资源（比如脚本、图片、样式）默认应该放在src/assets目录下。比如你的脚本叫custom-script.js，那正确的存放路径应该是src/assets/custom-script.js。

如果你的脚本放在其他目录（比如src/js），那需要确保这个目录被Angular的构建工具识别为静态资源目录（后面会说怎么配置）。

2. 检查index.html中的引用路径 #

根据文件的存放位置，调整index.html中的脚本引用路径：

• 如果脚本在src/assets下，引用应该是：

  <script src="assets/custom-script.js"></script>
  

  这里的路径是相对于index.html（位于src目录）的相对路径，ng serve会自动把src/assets映射到应用的根路径下。
• 注意大小写敏感：如果你的系统是Linux/macOS，文件名的大小写必须和引用完全一致（比如CustomScript.js和customscript.js是两个不同的文件）。

3. 验证Angular配置文件中的资源映射 #

Angular 5使用的是.angular-cli.json配置文件（后续版本才改为angular.json），你需要确保静态资源目录被包含在构建配置中：

1. 打开项目根目录下的.angular-cli.json
2. 找到apps数组里的assets字段，确认它包含你存放脚本的目录：

   "apps": [
     {
       "root": "src",
       "outDir": "dist",
       "assets": [
         "assets",
         "favicon.ico",
         // 如果你的脚本在src/js下，这里要加上"js"
         "js"
       ],
       ...
     }
   ]
   

   只有在这里配置的目录，ng serve才会把目录下的文件复制到开发服务器的资源目录中，否则会找不到文件。

4. 清除浏览器缓存 #

有时候浏览器会缓存之前的404响应，即使你已经修正了路径。可以尝试：

• 按Ctrl+Shift+R（Windows/Linux）或Cmd+Shift+R（macOS）强制刷新页面
• 或者直接清空浏览器的缓存后重新加载

5. 最后确认文件存在性 #

再仔细检查一遍：脚本文件确实存在于你指定的目录中，没有被误删除或者移动了位置。

如果按照上面的步骤操作后还是有问题，可以告诉我你的脚本存放路径和index.html中的引用代码，我再帮你进一步排查~

内容的提问来源于stack exchange，提问作者Santoshraju V