Exploring Angular2 for the first time with a tutorial called "guess-the-number."
Following the instructions on GitHub, Tutorial Angular2 by Example, was a breeze until I encountered an error in IntelliJ. The code works fine in the browser, but something seems off in my IntelliJ setup.
The specific error message reads: "Cannot find module '@angular/core'." See the screenshot below for reference:
https://i.sstatic.net/0FmiK.png
In an attempt to troubleshoot, I checked my properties file, which looks like this:
systemjs.config.js
System.config({
map : {
'app': 'app',
'rxjs': 'https://unpkg.com/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="72000a180132475c425c425f101706135c4340">[email protected]</a>',
'@angular/common': 'https://unpkg.com/@angular/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="d9bab6b4b4b6b799ebf7e9f7e9">[email protected]</a>',
'@angular/compiler': 'https://unpkg.com/@angular/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="80e3efedf0e9ece5f2c0b2aeb0aeb0">[email protected]</a>',
'@angular/core': 'https://unpkg.com/@angular/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="6b0804190e2b59455b455b">[email protected]</a>',
'@angular/platform-browser': 'https://unpkg.com/@angular/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="46362a27322029342b6b24342931352334067468766876">[email protected]</a>',
'@angular/platform-browser-dynamic': 'https://unpkg.com/@angular/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="71011d1005171e031c5c13031e060214035c15081f101c181231435f415f41">[email protected]</a>'
},
packages:{
'app': { main: 'main.ts', defaultExtension: 'ts' },
'@angular/common': { main: 'bundles/common.umd.js', defaultExtension: 'js' },
'@angular/compiler': { main: 'bundles/compiler.umd.js', defaultExtension: 'js' },
'@angular/core': { main: 'bundles/core.umd.js', defaultExtension: 'js' },
'@angular/platform-browser': { main: 'bundles/platform-browser.umd.js', defaultExtension: 'js' },
'@angular/platform-browser-dynamic': { main: 'bundles/platform-browser-dynamic.umd.js', defaultExtension: 'js' },
},
// DEMO ONLY! REAL CODE SHOULD NOT TRANSPILE IN THE BROWSER
transpiler: 'typescript',
typescriptOptions: {
emitDecoratorMetadata: true
}
});
Possible solutions to the issues?
Considering hosting files locally instead of linking them through external URLs like https://unpkg.com/@angular/[email protected].
IntelliJ might not recognize the systemjs.config.js file. Should I create a tsconfig.json file to make it more understandable for IntelliJ?