0

我想从 CDN 导入 react、react-dom 和其他供应商 JS 库,如 Okta、Jquery,而不是将这些作为包安装到 React 应用程序中。我试图在externals_React is not definedReactDOM is not defined

我正在使用 React - v16​​ 和 Webpack - v3

我为实现这一目标所做的步骤:

  1. 移除 react 和 react-dom form package.json 作为依赖
  2. 在 html 文件中添加了 cdn url - templates/full-width-template.html
      <body>
        <script 
          crossorigin src="https://unpkg.com/react@16.12.0/umd/react.development.js">
        </script>
        <script
          crossorigin
          src="https://unpkg.com/react-dom@16.12.0/umd/react-dom.development.js">
         </script>
       ....
       ....
       ....html started here onwards
     </body>
    

添加externals在 webpack.config - config/webpack.config.prod.js

module.exports = {
  mode: 'production',
  entry: ....entry-point here....,
  output: ....out-point here....,
  externals: {
    'react': 'React',
    'react-dom': 'ReactDOM',
  },
  module: {
    rules: [
      ...rules defined here
    ]
  },
  plugins: [
   ... plugins like HtmlWebpackPlugin, MiniCssExtractPlugin etc defined here... 
  ],
 devtool: 'source-map'
}
  1. yarn build命令成功运行并创建了包/块。
  2. yarn start,只要登录页面可见就抛出错误 -React is not defined : external 1

请建议我如何实现加载 CDN 而不是安装包并将其与 webpack v3 一起使用的功能。

4

0 回答 0