javascript - Dynamic import from node_modules throws "Cannot read property 'call' of undefined"

Question

Webpack-stream version: 5.2.1

npm version: 6.14.4

node version: v10.13.0

platform: windows10

I use gulp + webpack-stream for two modules: libraries.js and page.js

The problem relates only to the import from node_modules to page.js, the same import to libraries.js works well.

Import module as

import 'slick-carousel/slick/slick';

and even just import throws that error without call

Full code page.js

'use strict';

import '../_modules/forms/doctor-review';
import 'slick-carousel/slick/slick';

$(window).on('load', function () {
  $('.js-slick').slick();
});

webpack config for libraries.js:

{
          mode: λ.mode,
          output: {
            pathinfo: false,
          },
          plugins: [
            new webpack.ProvidePlugin({
              $: 'jquery',
              jQuery: 'jquery',
            }),
          ],
          module: {
            rules: [
              {
                test: /\.js$/,
                exclude: /(node_modules)/,
                use: {
                  loader: 'babel-loader',
                  options: {
                    presets: ['@babel/preset-env'],
                  },
                },
              },
            ],
          },
          optimization: {
            splitChunks: {
              cacheGroups: {
                default: false,
                vendors: false,
                vendor: {
                  chunks: 'all',
                  test: /node_modules/,
                },
              },
            },
          },
        }

webpack config for page.js:

{
              mode: λ.mode,
              output: {
                pathinfo: false,
              },
              plugins: [],
              module: {
                rules: [
                  {
                    test: /\.js$/,
                    exclude: /(node_modules)/,
                    use: {
                      loader: 'babel-loader',
                      options: {
                        presets: ['@babel/preset-env'],
                      },
                    },
                  },
                ],
              },
              optimization: {
                namedModules: true,
                namedChunks: true,
                splitChunks: {
                  cacheGroups: {
                    default: false,
                    vendors: false,
                    vendor: {
                      chunks: 'all',
                      test: /node_modules/,
                    },
                  },
                },
              },
            }

标签： javascriptwebpackgulpnode-modulesgulp-webpack