Error when starting @ngtools/webpack plugin via "grunt-webpack"

[anbaran]

When I start the webpack plugin @ngtools/webpack via grunt-webpack it results in error. When I start this same plugin directly via webpack it works without errors. I created minimal sample app to demonstrate this behavior.

How to reproduce

1. checkout the repository: git clone https://github.com/anbaran/ngtools-webpack-error.git
2. cd ngtools-webpack-error
3. install grunt cli: npm install -g grunt-cli
4. run: npm install

Now we have 2 options, run the webpack task directly in webpack or via grunt-webpack integration

Case 1 - Using webpack directly - compilation completes without error

 run: `npx webpack --config webpack.config.js`

Result: no error, compilation successful

Case 2 - Using grunt integration for webpack , the "grunt-webpack" - compilation results in error (see below)

 run: `grunt`

Result:

ERROR in : TypeError: Cannot read property 'getTsProgram' of undefined
    at AngularCompilerPlugin._getTsProgram (<project-location>/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:189:62)
    at getTypeChecker (<project-location>/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:533:43)
    at ast_helpers_1.collectDeepNodes.filter (<project-location>/node_modules/@ngtools/webpack/src/transformers/remove_decorators.js:14:60)
    at Array.filter (<anonymous>)
    at standardTransform (<project-location>/node_modules/@ngtools/webpack/src/transformers/remove_decorators.js:14:14)
    at transformer (<project-location>/node_modules/@ngtools/webpack/src/transformers/make_transform.js:14:25)
    at <project-location>/node_modules/typescript/lib/typescript.js:2892:86
    at reduceLeft (<project-location>/node_modules/typescript/lib/typescript.js:2585:30)
    at <project-location>/node_modules/typescript/lib/typescript.js:2892:42
    at transformRoot (<project-location>/node_modules/typescript/lib/typescript.js:67846:82)

Expected Behavior

Running a task via grunt-webpack or directly webpack should produce the same result

Context

One of the subtasks of my grunt build process is to compile Angular application using webpack plugin "@ngtools/webpack"

Your Environment

grunt: 1.0.3,
grunt-webpack: 3.1.3,
webpack: 3.12.0
node v10.10.0
npm 6.4.1
Linux Ubuntu VERSION="16.04.4 LTS (Xenial Xerus)

[p3x-robot]

finally we found the actual error.

[p3x-robot]

@anbaran have you not found the actual bug either?

[p3x-robot]

the problem is that we cant even see it touch grunt-webpack, thats the problem.

[anbaran]

No, i didnt investigate it deeper. Look at the demo app. The compilation works when run directly in webpack and it fails if grunt-webpack is used. So I assume it is grunt-webpack problem. I didn't have time (and knowledge) so far to analyse why exactly grunt-webpack fails. Do you have any new details?

[p3x-robot]

yeah i started looking at, because it is totally because of this and the program is not so big so i could catch the error.

[p3x-robot]

for now, i created a grunt task that actually works:

grunt.registerTask('grunt-webpack-build', function() {
    const done = this.async();
    const exec = require('child_process').exec;
    let configFile
    // you can change the webpack config file with some if....
    configFile = `${__dirname}/webpack.config.js`
    const run = exec(`./node_modules/.bin/webpack-cli --production --config ${configFile}`, {
        stdio: 'inherit',
        shell: true,
        customFds: [0,1,2],
    }, (e, stdout, stderr) => {
        if (e) {
            done(e);
            return
        }
        done();
    });
    run.stdout.on('data', (data) => {
        grunt.log.write(data)
    });

    run.stderr.on('data', (data) => {
        grunt.log.write(data)
    });
})

[anbaran]

Ok great, I will test it this week

[anbaran]

Hello,
I just tried your solution but I receive the following error, do you know what is going on there?

Warning: Command failed: ./node_modules/.bin/webpack-cli --production --config <project-location>ngtools-webpack-error/webpack.config.js
<project-location>/ngtools-webpack-error/node_modules/webpack-cli/bin/cli.js:291
			const statsPresetToOptions = require("webpack").Stats.presetToOptions;
			                                                     ^

TypeError: Cannot read property 'presetToOptions' of undefined
    at processOptions (<project-location>/ngtools-webpack-error/node_modules/webpack-cli/bin/cli.js:291:57)
    at yargs.parse (<project-location>/ngtools-webpack-error/node_modules/webpack-cli/bin/cli.js:536:3)
    at Object.parse (<project-location>/ngtools-webpack-error/node_modules/webpack-cli/node_modules/yargs/yargs.js:563:18)
    at <project-location>/ngtools-webpack-error/node_modules/webpack-cli/bin/cli.js:219:8
    at Object.<anonymous> (<project-location>/ngtools-webpack-error/node_modules/webpack-cli/bin/cli.js:538:3)
    at Module._compile (internal/modules/cjs/loader.js:689:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
    at Module.load (internal/modules/cjs/loader.js:599:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
    at Function.Module._load (internal/modules/cjs/loader.js:530:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:742:12)
    at startup (internal/bootstrap/node.js:279:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:696:3)
 Use --force to continue. 

[p3x-robot]

first, make sure it works with CLI, eg:

webpack --production --config <config-path-file>

then it will work with the grunt task as well, for sure. basically, it is the same execution.

[p3x-robot]

been using it the way you told me and i created a grunt task that actually uses the webpack cli from a config file...

[p3x-robot]

@anbaran have you created the config file? configFile = __dirname + '/webpack.config.js'?

[anbaran]

@p3x-robot p3x-robot Sorry I didn't answer you yet but I am busy in a different area, I will let you know soon