如何改变Angular 2个目录的路由？

Question

我开始使用 Angular 2，我一直在使用官方文档中的 Quickstart 项目，但我不喜欢 'app' 文件夹中的所有内容所以我在其中创建了一些文件夹并更改了路由，但我在控制台中收到此错误

http://localhost:3000/app/main.js 404 (Not Found)

这是我在路线中所做的更改：

main/main.ts

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from '../module/app.module';

const platform = platformBrowserDynamic();
platform.bootstrapModule(AppModule);

module/app.module.ts

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent }  from '../components/app_component/app.component';

@NgModule({
  imports:      [ BrowserModule ],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ]
})

export class AppModule { }

Answer 1

通常将所有这些组件分出到它们自己的文件夹中是一种不好的做法。您希望将所有组件保存在一个文件夹中并将该文件夹位置映射出来。你的问题是路径 http://localhost:3000/app/main.js does not exist. its actually http://localhost:3000/app/main/main.js 你需要在某处定义它。可能是你的index.html，它应该是这样的

<script>
       System.import('app/main')
        .then(null, console.error.bind(console));
</script>

或者在你这样的系统中

 map: {
      app: 'app/main',

Answer 2

此配置在 main.ts 文件中设置，此文件应放在 app/ 文件夹中，而不是名为 main 的子文件夹中。这个文件是主要的应用程序，它负责告诉 index.html 文件在哪里寻找应用程序文件。

这里有两个选择：

1 - 将 main.ts 文件放入 app/main.ts

2 - 将您的 systemjs.config.js 更改为指向您的主文件夹

...
packages: {
  app: {
    main: './main/main.js', // here you can set the new folder
    ...
  },
...

如何改变Angular 2个目录的路由？

How change Angular 2 directories routes?

routes

subdirectory

angular