How to solve module.id should be a string error using webpack2

9
votes

So I'm using webpack2 on a Angular2 project that has several external dependecies. Some of these dependencies are using commonjs and are declaring components like below:

@Component({
    moduleId: module.id,
    templateUrl: 'mycomponent.html'
    ...
})

This causes the error below:

Error: moduleId should be a string in "MyComponent"

After some research, I figure out this is due to Webpack expecting components to have id as a number while Angular declares it as string. I cannot change the dependency code. What can I do to live with this kind of dependency?

Thanks!

3
angularwebpack-2

3 Answers

4
votes

So here's what I came up to live with that dependency for now. Use string replace loader to remove that line for me:

{
    test: /.*node_modules\/my-dependency-folder\/.*\.js/,
    loader: 'string-replace-loader',
    query: {
        search: 'moduleId: module.id,',
        replace: ''
    }
}

Hope this helps somebody with the same issue.

1
votes

I don't know if this is going to help or no, but maybe someone would need it anyway (I did!).

So in worst cases it is possible to search for module.id in the .js files and add .toString() method (module.id.toString()), it will solve the problem.

0
votes

Remove the line 

moduleId: module.id,

It works.