не удается найти модуль ReactDOM в родительском приложении при добавлении его во внешние - PullRequest
0 голосов
/ 01 марта 2019

Привет. Я пытаюсь создать компонент с помощью create-реагировать на приложение.Это будет использоваться в другом родительском приложении.Родительское приложение устанавливает компонент из git.родительский applcation имеет что-то вроде этого в своем package.json

"component": "<git url of component>",

Так что я добавил еще один webpack.config.js и использовал его для объединения моего компонента в один файл.

Поскольку родительское приложение реагирует и реагирует, я не должен добавлять их в пакет, поэтому я добавил их к внешним компонентам в веб-пакете.Я добавил следующие сценарии в package.json

"scripts": {

    "buildcomponent": "SET NODE_ENV=production&&rm -rf dist && mkdir dist && npx babel src/discussion --out-dir dist --copy-files",
    "bundlecomponent": "webpack --config webpack.config.js",
    "createbundle": "npm run buildcomponent && npm run bundlecomponent"
  },

Я использую сценарий createbundle для создания пакета, как показано ниже

npm run createbundle

Ниже приведен мой конфиг веб-пакета

const path = require("path")
const UglifyJsPlugin = require("uglifyjs-webpack-plugin")
const glob = require("glob")

module.exports = {
  entry: {
    "bundle.js": glob.sync("./dist/*.js")
  },
  output: {
    filename: "build/static/js/bundle.min.js",
    libraryTarget: 'umd'
  },
  externals: {
    'react': 'react', // Case matters here 
    'react-dom' : 'ReactDOM' // Case matters here, 
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ["style-loader", "css-loader"],
      },
      {
        test: /\.(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,
        loader: 'file-loader'
      }
    ],
  },
  plugins: [new UglifyJsPlugin()],
}

При таком способе создается комплект.Но когда я пытаюсь использовать компонент в родительском приложении, я получаю сообщение об ошибке: не удается найти модуль ReactDOM.Но реакция-дом присутствует в списке зависимостей родительского приложения.

...