Typescript SystemJS类型脚本的困境？

我似乎不理解模块和路径。我正在编写一个Chrome扩展，并尝试将typescript与angular2结合使用。我曾经让它工作过一次，但我想重组我的目录。似乎每次我想得到一个项目设置或添加文件或页面，我都有这个问题。有没有地方可以学习定位模块和javascript/typescript文件的规则

我想做的是有一个

src

文件夹和我的html、css（或更少的/sass）和typescript文件，还有一个

www

文件夹和我的html、css和编译的js文件。我已经设置了grunt任务，它们编译得很好。由于我使用的是Angular 2，在一个扩展中我不能使用内联脚本，因此我为我创建的每个页面都有两个单独的脚本，一个

src/pages/index page.ts

脚本，它具有系统设置，并直接从

www/index.html

和

加载：

以及它应该加载的

src/pages/index boot.ts脚本

import {provide} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';
import {ROUTER_PROVIDERS, APP_BASE_HREF, LocationStrategy, HashLocationStrategy} from 'angular2/router';
import {IndexApp} from './index-app';

bootstrap(IndexApp, [
  ROUTER_PROVIDERS,
  provide(LocationStrategy, { useClass: HashLocationStrategy })
]);

当然，我在尝试加载
/www/js/pages/index boot
时遇到网络故障。如果我添加了js，那么它会加载该文件，但是在查找
router
和
index-app
时会出现错误

为什么
索引页
试图在没有扩展名的情况下在浏览器中加载
索引引导
？我是否需要以不同的方式组织我的文件？有没有一个网站可以解释这一切？我不明白为什么一个页面必须有三个独立的代码文件（系统配置和导入引导、引导和应用）

为什么索引页尝试在没有扩展名的情况下在浏览器中加载索引引导

因为你没有要求它这样做。据我所知，从您的问题中，您的设置中没有文件夹appScripts，因此defaultExtension:“js”被忽略。要以简单的方式修复此问题，请使用：

System.defaultJSExtensions = true;

请参阅此处的更多信息：

这将使您在学习如何在systemjs（）中设置包时开始学习，但请注意，此构造已被弃用

作为起点，angular2是一个好地方。注意他们对名为“app”的包的使用情况，并将其与他们的文件夹结构进行比较——注意此处的“app”文件夹

SystemJS您必须为每个应用程序设置一次（index page.js）。不是每一页都有。然后，您需要一些地方来引导angular2应用程序（index boot.ts），然后引导包含业务逻辑的应用程序的其余部分（app.ts和其他所有内容）

为什么索引页尝试在没有扩展名的情况下在浏览器中加载索引引导

因为你没有要求它这样做。据我所知，从您的问题中，您的设置中没有文件夹appScripts，因此defaultExtension:“js”被忽略。要以简单的方式修复此问题，请使用：

System.defaultJSExtensions = true;

请参阅此处的更多信息：

这将使您在学习如何在systemjs（）中设置包时开始学习，但请注意，此构造已被弃用

作为起点，angular2是一个好地方。注意他们对名为“app”的包的使用情况，并将其与他们的文件夹结构进行比较——注意此处的“app”文件夹

SystemJS您必须为每个应用程序设置一次（index page.js）。不是每一页都有。然后您需要一些地方来引导angular2应用程序（index boot.ts），然后包含业务逻辑的应用程序的其余部分（app.ts和其他所有内容）将解决您的扩展问题

System.config({
defaultJSExtensions:true，//将在模块名称前加上.js
路径：{
“*”：“/www/js/pages/*”，//如果您的所有模块都在/www/js/pages下
“angular2/*”：“/path/to/angular2/*”
},
包：{//我在您的示例中没有看到任何appScripts包引用，您可能可以删除该包。
应用脚本：{
defaultExtension:'js'
}
}
});

使用此配置，您只需执行
System.import（'index-boot'）
defaultJSExtensions
即可解决扩展问题

System.config({
defaultJSExtensions:true，//将在模块名称前加上.js
路径：{
“*”：“/www/js/pages/*”，//如果您的所有模块都在/www/js/pages下
“angular2/*”：“/path/to/angular2/*”
},
包：{//我在您的示例中没有看到任何appScripts包引用，您可能可以删除该包。
应用脚本：{
defaultExtension:'js'
}
}
});

使用此配置，您只需执行
System.import（'index-boot'）
是否有方法告诉angular2和rx使用提供的捆绑包？如果您想使用捆绑包，您必须使用
脚本
标记加载它们，并将其放置在
System.config
之前。您还可以签出项目（dev和prod build using System），因此包名需要引用服务器上的目录，这使它成为自己的模块？该目录由传递到
System.config
的config对象的packages对象中的属性名指定？这与
系统加载的内容如何对应。导入
？例如，如果我有
js/appScripts
和do
System.import（'js/appScripts/page.js'）
，那么键是否必须是
'js/appScripts'：{…}
？你应该读一下：有没有办法告诉angular2和rx使用提供的捆绑包？如果你想使用捆绑包，您必须使用
script
标记加载它们，并将其放置在
System.config
之前。您还可以签出项目（dev和prod build using System），因此包名需要引用服务器上的目录，这使它成为自己的模块？该目录由传递到
System.config
的config对象的packages对象中的属性名指定？这与
系统加载的内容如何对应。导入
？例如，如果我有
js/appScripts
和do
System.import（'js/appScripts/page.js'）
，那么键必须是
'js/a吗