Menu
I'm trying to setup a basic Angular 2 app with TypeScript. But I'm stuck because SystemJS doesn't seem to be doing anything with the defaultExtension: 'js' option.
My index.html looks like this:
<!DOCTYPE html>
<html lang="en">
<head>
<base href="/test/">
<meta charset="UTF-8">
<title>Test</title>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet">
<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>
System.config({ packages: { app: { format: 'register', defaultExtension: 'js', } } });
System.import('backend/app/boot')
.then(null, console.error.bind(console));
</script>
</head>
<body>
<app>Loading</app>
</body>
</html>
But this then gives me the following error:
GET http://localhost:1122/test/backend/app/boot 404 (Not Found)
I can add the .js extension to the path in the System.import command, so that it looks like this:
System.import('backend/app/boot.js')
Then it is able to find boot.js, but then it complains that it can't find app.component. So basically I have to add a .js extension to that import as well and for every other component that I will have in my application.
I don't think that's the solution I have to go for. So how can I fix this System.import problem? It looks like that it is ignoring defaultExtension: 'js' for some reason.
617
You are setting the js as the default extension for the app package, but your code is in backend/app, not app, either remove the backend folder or fix your package config.
126
Just trying out Angular2 and had the same problem. I guess, another option could be using baseURL. E.g.:
System.config({
baseURL: 'backend/',
packages: {
app: {
format: 'register',
defaultExtension: 'js',
}
}
});
System.import('app/boot')
.then(null, console.error.bind(console));
I had the same problem, I could find the following solution. Use map to add your extra path to your app folder like this
System.config({
packages: {
app: {
format: 'register',
defaultExtension: 'js'
}
},
map: { 'app': './backend/app' }
});
System.import('app/boot');
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
