系统 JS 不加载模块

Posted

技术标签:

【中文标题】系统 JS 不加载模块【英文标题】:System JS not loading modules 【发布时间】:2016-05-15 02:06:58 【问题描述】:

我在使用 Angular 2 时遇到了一个奇怪的 System JS 问题。

暂时一切正常,但看似随机的 System JS 再也找不到模块了……

我收到此错误消息:

GET http://localhost:9000/angular2/platform/browser.js 404 (Not Found) @ system.src.js:4891(anonymous function) @ system.src.js:4891
GET http://localhost:9000/angular2/core.js 404 (Not Found) @ system.src.js:4891
GET http://localhost:9000/angular2/router.js 404 (Not Found) @ system.src.js:4891
GET http://localhost:9000/angular2/http.js 404 (Not Found) @ system.src.js:4891
GET http://localhost:9000/angular2/core.js 404 (Not Found) @ system.src.js:4891
GET http://localhost:9000/angular2/http.js 404 (Not Found) @ system.src.js:4891
GET http://localhost:9000/angular2/src/facade/lang.js 404 (Not Found) @ system.src.js:4891
GET http://localhost:9000/angular2/router.js 404 (Not Found) @ system.src.js:4891

有时错误更多,有时错误更少......

最奇怪的是,在等待一段时间并尝试一遍又一遍地刷新页面后,应用程序又神奇地重新开始工作了!

我使用 systemjs@0.19.20 和 angular2@2.0.0-beta.3(当时最新)。

带有 SystemJS 配置的 index.html 的脚本部分如下所示:

<script src="./node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="./node_modules/es6-shim/es6-shim.min.js"></script>
<script src="./node_modules/systemjs/dist/system.js"></script>
<script>
  //configure system loader
  System.config(
    defaultJSExtensions: true
  );
  //bootstrap the Angular2 application
  System.import('dist/app').catch(console.log.bind(console));
</script>
<script src="./node_modules/rxjs/bundles/Rx.js"></script>
<script src="./node_modules/angular2/bundles/angular2.dev.js"></script>
<script src="./node_modules/angular2/bundles/http.dev.js"></script>
<script src="./node_modules/angular2/bundles/router.dev.js"></script>

有人知道这个问题吗?

谢谢!

【问题讨论】:

如果你能分享你的systemjs配置就好了 同意@Vldao。没有这个,我们只能尝试猜测;-) 我已经添加了配置。 问题是你正在加载“system.js”而不是“system.src.js”,这是依赖项正在寻找的。​​span> 【参考方案1】:

您的 SystemJS 似乎不正确:

你是否在你的 HTML 入口页面中使用了类似的东西:

<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
<script src="node_modules/angular2/bundles/router.dev.js"></script>
<script src="node_modules/angular2/bundles/http.dev.js"></script>

<script>
  System.config(
    packages:         
      app: 
        format: 'register',
        defaultExtension: 'js'
      
    
  );
  System.import('app/boot')
        .then(null, console.error.bind(console));
</script>

根据我在您的 HTTP 调用中看到的情况,我猜您的 SystemJS 配置中有类似的内容:

  System.config(
    packages:         
      app: 
        format: 'register',
        defaultExtension: 'js'
      ,
      angular2: 
        format: 'register',
        defaultExtension: 'js'
      
    
  );

【讨论】:

那么正确的方法是什么? (我也有类似的问题)【参考方案2】:

我没有足够的权限发表评论和询问更多信息,这可能是一个很长的机会。您是否尝试检查文件 app.ts 是否实际驻留在 dist/app 中?

【讨论】:

以上是关于系统 JS 不加载模块的主要内容,如果未能解决你的问题,请参考以下文章

node中的js—模块系统

如何在没有模块加载系统的情况下将我的 Typescript 编译成单个 JS 文件?

Node.js 模块加载及包的管理

selenium模块无头化浏览器 设置不加载页面css图片js

webpack加载AMD模块而不捆绑

webpack简介