Оптимизация размера приложения React в рабочей среде с помощью Amcharts

#javascript #reactjs #webpack #amcharts #amcharts4

#javascript #reactjs #webpack #amcharts #amcharts4

Вопрос:

Я использую amcharts (amcharts4) с приложением React (созданным с использованием cra).

Я смог успешно исключить несколько зависимостей (cpexcel, canvg, pdfmake), используя webpack Externals в webpack.config файле (node_modules/react-scripts/config/webpack.config.js) , подобном этому:

 externals: [
      function (context, request, callback) {
      if (/cpexcel|canvg|pdfmake/.test(request)) {
        return callback(null, "commonjs "   request);
      }
      callback();
    }]
 

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

 externals: [
      function (context, request, callback) {
      if (/xlsx|canvg|pdfmake/.test(request)) {
        return callback(null, "commonjs "   request);
      }
      callback();
    }],
 

Ошибка:

 $ react-scripts build
Creating an optimized production build...
Failed to compile.

chunk runtime-main [entry]
Cannot convert undefined or null to object
 

Я не использую какую-либо функцию csv amcharts .
источник-map-explorer

Есть ли какой-либо другой возможный способ исключения xlsx (без использования автономной библиотеки и удаления вручную) amcharts ?

Ответ №1:

Ошибка произошла из-за react-chartjs-2 . Я пробовал несколько библиотек диаграмм и забыл удалить библиотеку.

Успешно исключена xlsx библиотека.

 externals: [
      function (context, request, callback) {
      if (/xlsx|canvg|pdfmake/.test(request)) {
        return callback(null, "commonjs "   request);
      }
      callback();
    }],