Webpack using external modules from CDN

Question

I am using React with Redux for an application and use Webpack for bundling. I wanted to load some of the libraries from CDN and not to bundle them. This works fine for React and ReactDOM, but I cannot make it work for redux and other libraries without global export. This is my current externals section in the Webpack config:

       externals: [
          { "react": "React" },
          { "react-dom": "ReactDOM" },
          {
              "redux": {
                  commonjs: "redux",
                  commonjs2: "redux",
                  amd: "redux"
              }
          }
        ]

In the HTML I have a reference to the redux CDN:

<script src="https://cdnjs.cloudflare.com/ajax/libs/redux/3.6.0/redux.min.js"></script>

This is the error I am getting:

Uncaught TypeError: Cannot read property 'combineReducers' of undefined
    at Object.__webpack_exports__.a (ui.ts:10)
    at __webpack_require__ (bootstrap 749616a…:19)
    ...

I haven't got much experience with modules, so maybe I am missing something simple or it is just not possible.

Answer 1

Try Redux (instead of redux). The CDN file exports Redux and that's how you're probably referencing it in your code.

externals: [
  { "react": "React" },
  { "react-dom": "ReactDOM" },
  { "redux": "Redux"}
]