Systemjs配置在Angular2中加载templateUrl

时间:2016-01-13 07:55:51

标签: javascript angularjs

使用带有angular2的systemjs时遇到问题。

的index.html

System.config({
     packages: {
       'app': {
               format: 'register',
               defaultExtension: 'js'
        },
        'angular2': {
                defaultExtension: 'js'
        },
        'rxjs': {
               defaultExtension: 'js'
        }
    },
    paths: {
        '*': 'dist/*',
        'app/*': 'dist/app/*',
        'angular2/*': 'node_modules/angular2/*',
        'rxjs/*': 'node_modules/rxjs/*'
    }
});

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

app.js

import {NavbarComponent} from './components/navbar/navbar';
@Component({
    selector: 'main-app',
    templateUrl: './app/app.html',
    directives: [RouterOutlet, NavbarComponent]
})

这是结构:

enter image description here

运行时:

dev: {
        port: 8080,
        host: "127.0.0.1",
        open: '/',
        root: '.',
        file: "index.html",
        wait: 1000
    },

所有.js文件都加载了路径http://127.0.0.1:8080/dist/app/.../....js
但是templateUlr加载了路径http://127.0.0.1:8080/app/.../...js
如何配置加载带路径为.js文件的templateUrl?

1 个答案:

答案 0 :(得分:1)

我发布这个作为答案,因为评论这个太长了!!!

首先作为你的问题的答案 - 你必须在我的评论之后给出src文件夹中的路径,就像现在一样。 其次,您在谈论gulp.task('compile-ts', function () { var sourceTsFiles = [ config.allTs, config.allcompoTs ]; var tsResult = gulp .src(sourceTsFiles) .pipe(sourcemaps.init()) .pipe(tsc(tsProject)); return tsResult.js .pipe(sourcemaps.write('.')) .pipe(gulp.dest(config.tsOutputPath)); }); 个文件 -

是的,您可以在加载templateUrl时配置为自动映射路径,您必须按以下方式进行一些gulp任务:

将此代码放入gulpfile.js

module.exports = function() {

    var config = {
        allTs : 'src/*.ts',
        allcompoTs: 'src/**/*.ts',
        tsOutputPath : 'dist/',
        index : 'index.html'
    };
    return config;
};

和你的gulp.config.js中的这个

TIME_ZONE = 'Europe/Moscow'
USE_I18N = True
USE_L10N = True
USE_TZ = True
CELERY_ENABLE_UTC = True
CELERY_TIMEZONE = 'Europe/Moscow'

现在您可以根据您的要求配置gulp任务。 希望它能帮到你!