Конфигурация DLL веб-пакета не работает

Question

Я пытаюсь создать конфигурацию dll с помощью webpack 4, но продолжаю получать:

Uncaught ReferenceError: React is not defined

Моя конфигурация очень проста:

module.exports = {
  entry: {
    vendor: ["react", "react-dom"]
  },
  output: {
    filename: "[name]-manifest.dll.js",
    path: base.path.project("build"),
    library: "[name]",
    libraryTarget: "umd"
  },
  plugins: [
    new webpack.DllPlugin({
      name: "[name]",
      path: base.path.project("build/[name]-manifest.json"),
      context: base.path.src("app")
    })
  ]
};

В своей конфигурации разработки я используюdllreferenceplugin.

new webpack.DllReferencePlugin({
  context: base.path.src("app"),
  manifest: require("../build/vendor-manifest.json")
})

и, конечно, я определяю внешние компоненты в конфигурации разработки, потому что я не хочу включать их снова при создании своего файла js разработки:

  externals: {
    react: "React",
    "react-dom": "ReactDOM"
  }

В моемкод, который я импортирую React.

import * as React from "react";

Но в браузере, который я продолжаю получать, React не определен.

Я все погуглил и не нашел решения этой проблемы?

Спасибо за любую помощь!

Answer 1

Просто удалите внешнее свойство из файла конфигурации вашего веб-пакета приложения. Кроме того, включите файл dll в файл index.html.

Я также столкнулся с той же проблемой, поскольку использовал как плагин dllReference, так ивнешний одновременно.

Answer 2

Используй import React, { Component } from 'react'; сам.JSX хочет, чтобы реакция находилась в области видимости.

В основном видны только внешние элементы, используемые при создании библиотеки, например модуль npm, который используют другие люди, использующие React.React будет помечен как внешний в этом пакете, чтобы избежать двойного включения React в локальном приложении и внутри модуля.

Если это процесс сборки приложения, а не модуль npm, томаркировка не должна реагировать как внешняя.Ваша связка должна включать реакцию.Маркировка реагирует, поскольку внешние элементы исключают ее из пакета и возлагают на вас ответственность за ручную загрузку React до загрузки пакета.

Опция конфигурации внешних устройств позволяет исключить зависимости из выходных пакетов.

См. Документы по внешним сетям здесь .