Hi, I am trying to configure webpack in order to work with AOT, however I am getting this error. I tried with changing versions but without success, in some cases I even got more errors.
Windows 10
Node: v7.6.0
@ngtools/webpack: 1.2.12
https://github.com/milenkovic/webpack-angular-aot
npm install
npm run project-aot
ERROR in Cannot read property 'getSourceFile' of undefined
ERROR in C:/Workspace/webpack-aot/public/javascripts/core/projects/main.aot.ts (3,34): Cannot find module './ngfactory/public/javascripts/core/projects/app.module.ngfactory'.)
ERROR in ./public/javascripts/core/projects/main.aot.ts
Module not found: Error: Can't resolve './ngfactory/public/javascripts/core/projects/app.module.ngfactory' in 'C:\Workspace\webpack-aot\public\javascripts\core\projects'
@ ./public/javascripts/core/projects/main.aot.ts 3:0-103
The error lies in node_modules\@ngtools\webpack\src\compiler_host.js in function _resolve(path), when the operating system is Windows.
In some cases, this function calls to path.join, which returns a normalized path under the current OS, which does not correspond to the idea of _resolve function to replace backslashes with normal slashes.
Until a new version with this fix appears, you can replace manually that function with the code as follows:
_resolve(path) {
path = this._normalizePath(path);
if (path[0] == '.') {
return this._normalizePath(path_1.join(this.getCurrentDirectory(), path));
}
else if (path[0] == '/' || path.match(/^\w:\//)) {
return path;
}
else {
return this._normalizePath(path_1.join(this._basePath, path));
}
}
After this, the problem disappears.
horrible error message
This error literally cost me 5 hours debugging. Replacing with
_resolve(path) {
path = this._normalizePath(path);
if (path[0] == '.') {
return this._normalizePath(path_1.join(this.getCurrentDirectory(), path));
}
else if (path[0] == '/' || path.match(/^\w:\//)) {
return path;
}
else {
return this._normalizePath(path_1.join(this._basePath, path));
}
}
solved it for me thought.
@Dobryvechir's code was missing a backslash:
else if (path[0] == '/' || path.match(/^\w://)) {
^
SyntaxError: Unexpected token )
I have the same problem. After changing this method, the error persists:
ERROR in Cannot read property 'getSourceFile' of undefined
ERROR in /home/arlindo/git/vendedoronline/frontend/src/app/utils/hmac-http-client.ts (39,63): Cannot find name 'CryptoJS'.)
/home/arlindo/git/vendedoronline/frontend/src/app/utils/hmac-http-client.ts (41,63): Cannot find name 'CryptoJS'.)
/home/arlindo/git/vendedoronline/frontend/src/app/utils/hmac-http-client.ts (43,63): Cannot find name 'CryptoJS'.)
ERROR in /home/arlindo/git/vendedoronline/frontend/src/app/security/securityToken.ts (5,9): Cannot find name '_'.)
ERROR in /home/arlindo/git/vendedoronline/frontend/src/app/account/account.ts (12,13): Cannot find name '_'.)
ERROR in /home/arlindo/git/vendedoronline/frontend/src/app/empresa/empresa.ts (11,13): Cannot find name '_'.)
ERROR in /home/arlindo/git/vendedoronline/frontend/src/app/fabricante/fabricante.ts (10,13): Cannot find name '_'.)
ERROR in /home/arlindo/git/vendedoronline/frontend/src/app/linha/linha.ts (10,13): Cannot find name '_'.)
The references:
///<reference path="../../../typings/cryptojs/cryptojs.d.ts" />
///<reference path="../../../typings/lodash/lodash.d.ts" />
I'm on Windows 10 using @ngtools/webpack:1.3.0. I can confirm @maffelbaffel's fix works.
You can paste this into your webpack.config.js and avoid touching the node_modules folder, especially useful for automated deployment scenarios:
// workaround https://github.com/angular/angular-cli/issues/5329
var aotPlugin = new ngToolsWebpack.AotPlugin({
tsConfigPath: "./tsconfig.aot.json",
entryModule: path.resolve(__dirname, "./ClientApp/components/main.module#MainModule"),
});
aotPlugin._compilerHost._resolve = function(path_to_resolve) {
path_1 = require("path");
path_to_resolve = aotPlugin._compilerHost._normalizePath(path_to_resolve);
if (path_to_resolve[0] == '.') {
return aotPlugin._compilerHost._normalizePath(path_1.join(aotPlugin._compilerHost.getCurrentDirectory(), path_to_resolve));
}
else if (path_to_resolve[0] == '/' || path_to_resolve.match(/^\w:\//)) {
return path_to_resolve;
}
else {
return aotPlugin._compilerHost._normalizePath(path_1.join(aotPlugin._compilerHost._basePath, path_to_resolve));
}
};
Thanks for sharing @tinchou! That fixed it for me. Was having the same problem on Windows 10....wasted more time than I care to admit on this issue. :-)
Yeah, that sucks. The problem is not knowing which one is the broken
component after a big update. I was lucky I was glancing over that repo's
issues a couple of hours before updating myself.
@tinchou can you share plugins context of your webpack config for this workaround?
What do you mean? This?
plugins: [
aotPlugin,
new webpack.optimize.UglifyJsPlugin({
mangle: { screw_ie8: true },
compress: {
screw_ie8: true,
warnings: false,
}
}),
new webpack.LoaderOptionsPlugin({
minimize: true,
debug: false
}),
// ....
@tinchou yea thanks, i had dumb mistake with var aotPlugin = new ngToolsWebpack.AotPlugin({ part defined after webpack config instead of before
@tinchou screw_ie8: true, is default. You don't need that.
where is this webpack.config.js file everyone speaks of along with the aotPlugin settings?
Does @angular/cli use it?
I've been trying to get a --prod and/or --aot build to work for months... seem to be in upgrade/dependency hell / along with not having any idea where the error lines
ng build --aot
No NgModule metadata found for 'AppModule'
expanding that:
ZoneAwareError http://localhost:4200/polyfills.bundle.js:7954:21
NgModuleResolver.prototype.resolve http://localhost:4200/vendor.bundle.js:36464:23
CompileMetadataResolver.prototype.getNgModuleMetadata http://localhost:4200/vendor.bundle.js:37043:37
JitCompiler.prototype._loadModules http://localhost:4200/vendor.bundle.js:48238:41
JitCompiler.prototype._compileModuleAndComponents http://localhost:4200/vendor.bundle.js:48197:47
JitCompiler.prototype.compileModuleAsync http://localhost:4200/vendor.bundle.js:48159:16
PlatformRef_.prototype._bootstrapModuleWithZone http://localhost:4200/vendor.bundle.js:6792:16
PlatformRef_.prototype.bootstrapModule http://localhost:4200/vendor.bundle.js:6778:16
[104] http://localhost:4200/main.bundle.js:57:1
__webpack_require__ http://localhost:4200/inline.bundle.js:53:12
[265] http://localhost:4200/main.bundle.js:100:18
__webpack_require__ http://localhost:4200/inline.bundle.js:53:12
webpackJsonpCallback http://localhost:4200/inline.bundle.js:24:23
<anonymous>
I'm not using the CLI, but webpack with @ngtools/webpack plugin. I think
you can "eject" your webpack configuration with the CLI if you need to use
this workaround.
On Fri, Apr 14, 2017, 16:29 Brad Kent notifications@github.com wrote:
where is this webpack.config.js file everyone speaks of along with the
aotPlugin settings?—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/angular/angular-cli/issues/5329#issuecomment-294219964,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ABeg9O6VT8ZXHl7bn2UfC4TJ4KuCPcWjks5rv8kdgaJpZM4MX7At
.
thx @tinchou for the workaround, works perfectly for me (win7x64)
Any ETA for when a final fix for this will be deployed? Thanks
Deployed in 1.3.1
thx @hheexx . bugfix confirmed.
I solved min by pressing Ctrl + C on the terminal to end the current npm start,
then ran the entire setup with a npm start.
This error occurred to me when I was switching branches.
This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
_This action has been performed automatically by a bot._
Most helpful comment
I'm on Windows 10 using
@ngtools/webpack:1.3.0. I can confirm @maffelbaffel's fix works.You can paste this into your
webpack.config.jsand avoid touching thenode_modulesfolder, especially useful for automated deployment scenarios: