3

i am trying to modify a current project using webpack. On my scripts i am using lodash library but i have also scripts that are not written on ES6 so i load lodash globally using a normal script tag. Based on the webpack documentation i have added the below config on the webpack (https://webpack.js.org/configuration/externals/).

lodash : {
        commonjs: 'lodash',
        amd: 'lodash',
        root: '_' // indicates global variable
      },

I compile the code using babel without any problem but when the actual code is executed i receive the below error "TypeError: Cannot read property 'forEach' of undefined"

If i remove the import _ from "lodash"; statement from the file then the issue is resolved and script is working as expected as _ is on global.

But this was expected to work also without adding the externals correct ? According with the webpack example for jquery 

module.exports = {
  //...
  externals: {
    jquery: 'jQuery'
  }
};

The below code will be unchanged

import $ from 'jquery';
$('.my-element').animate(/* ... */);

In my case why is not working ? Any suggestions ? ideas?

user1521944
  • 317
  • 1
  • 2
  • 14

2 Answers2

2

I think i found a solution, after i read the documentation again and again i noticed that message which is also on yellow border

An object with { root, amd, commonjs, ... } is only allowed for libraryTarget: 'umd'. It's not allowed for other library targets.

So i have changed my config from 

lodash : {
      commonjs: 'lodash',
      amd: 'lodash',
      root: '_' // indicates global variable
    }

to 

lodash: '_'

and issue solved, now is working as expected. It will be great of course if i understand why this was an issue

user1521944
  • 317
  • 1
  • 2
  • 14
0

I encountered the same problem, and changed the externalsType: 'window'

{
   externalsType: 'window',
   externals: {
     lodash: '_'
   },
   ...

}

almost solve the problem, but, In the following condition, throw errors:

import _ from 'lodash';
const { get } = _;
echoechoa
  • 1