我尝试在组件中使用html的相对路径,我也将我的js文件映射到dist文件夹..我的组件代码是
应用程序/ app.component.ts
import { Component } from '@angular/core'; @Component({ moduleId: module.id,selector: 'my-app',templateUrl: 'app.component.html' }) export class AppComponent { }
html文件在同一目录中,即
应用程序/ app.component.html
<h1> Wolaa </h1>
我收到了以下错误
它完全清楚,角度是在“dist / app / app.component.html”找到app.component.html文件,这不是我怎么能解决这个问题?
我的systemjs.config.js文件是
/** * System configuration for Angular 2 samples * Adjust as necessary for your application needs. */ (function(global) { // map tells the System loader where to look for things var map = { 'app': 'dist',//'app','@angular': 'node_modules/@angular','angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api','rxjs': 'node_modules/rxjs' }; // packages tells the System loader how to load when no filename and/or no extension var packages = { 'app': { main: 'main.js',defaultExtension: 'js' },'rxjs': { defaultExtension: 'js' },'angular2-in-memory-web-api': { main: 'index.js',}; var ngPackageNames = [ 'common','compiler','core','forms','http','platform-browser','platform-browser-dynamic','router','router-deprecated','upgrade',]; // Individual files (~300 requests): function packIndex(pkgName) { packages['@angular/'+pkgName] = { main: 'index.js',defaultExtension: 'js' }; } // Bundled (~40 requests): function packUmd(pkgName) { packages['@angular/'+pkgName] = { main: 'bundles/' + pkgName + '.umd.js',defaultExtension: 'js' }; } // Most environments should use UMD; some (Karma) need the individual index files var setPackageConfig = System.packageWithIndex ? packIndex : packUmd; // Add package entries for angular packages ngPackageNames.forEach(setPackageConfig); var config = { map: map,packages: packages }; System.config(config); })(this);
我的tsconfig.json是
{ "compilerOptions": { "target": "es5","module": "commonjs","moduleResolution": "node","sourceMap": true,"emitDecoratorMetadata": true,"experimentalDecorators": true,"removeComments": false,"noImplicitAny": false,"outDir": "dist" } }
解决方法
以下是文档中可能有用的模板相对路径的一些详细信息:
https://angular.io/docs/ts/latest/cookbook/component-relative-paths.html