«Процесс не определен» с таблицей реакций js -2 CDN

Question

Я использую React CDN специально для одного компонента на странице панели инструментов. Я хотел бы использовать Chart JS в компоненте и заметил, что он также имеет CDN react-chartjs-2. Однако, когда я добавляю скрипт, я получаю эту ошибку:

Uncaught ReferenceError: process is not defined
    at react-chartjs-2.js:80
    at react-chartjs-2.js:4
    at react-chartjs-2.js:5

В строке 80 есть:

if (process.env.NODE_ENV !== 'production') {
  validateFormat = function validateFormat(format) {
    if (format === undefined) {
      throw new Error('invariant requires an error message argument');
    }
  };
}

Строки 1 - 5:

(function (global, factory) {
    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('chart.js')) :
    typeof define === 'function' && define.amd ? define(['exports', 'react', 'chart.js'], factory) :
    (factory((global.ReactChartjs2 = {}),global.React,global.Chart));
}(this, (function (exports,React,Chart) { 'use strict';

В HTML сценарии таковы:

        <script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
        <script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
        <script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
        <script crossorigin src="https://cdnjs.cloudflare.com/ajax/libs/react-chartjs-2/2.9.0/react-chartjs-2.js"></script>

Я действительно не нахожу много информации о CDN, поэтому мне интересно, не работают ли эти CDN вместе или есть что-то, что я м отсутствует.

Любая помощь в получении этого движения будет принята с благодарностью.

Answer 1

Библиотека, как и большинство компонентов React, изначально не поддерживает браузер. Предполагается, что он находится в среде инструмента сборки (то есть Node.js), поэтому он думает, что уже существует глобальный объект process. Это упущение со стороны разработчиков, но ваш сценарий использования является относительно редким, поэтому они не тестируют его.

Вам нужно использовать инструмент сборки, такой как Webpack, Rollup или Parcel, чтобы иметь возможность его использовать. library.

PS: чтобы уменьшить размер пакета, вы должны использовать .min.js CDN вместо .js, т.е. иметь URL-адрес https://cdnjs.cloudflare.com/ajax/libs/react-chartjs-2/2.9.0/react-chartjs-2.min.js.