Реакция - Построение среды разработки, но ошибки сборки Производства

Question

Я взял на себя проект и по какой-то причине работа в режиме разработки работает отлично, но когда я пытаюсь npm run build для производства, он всегда возвращает эту ошибку:

ReferenceError: Неизвестно плагин "@ babel / plugin-Предложение-класс-свойства", указанный в "/home/computer/Documents/project-name/node_modules/react-player/package.json"

Я пытался заглядывая внутрь react-player, и единственное, что я заметил, это то, что они используют Babel 7, в то время как текущий проект использует Babel 6 (обе в качестве зависимостей dev). Я недостаточно осведомлен, чтобы понять, почему он выдает ошибку, но вот что я пробовал:

1. Удалить @babel/plugin-propsoal-class-properties из пресетов /react-player/package.json babel.
   • Результаты: выдает ту же ошибку, но вместо @babel/core. В этот момент я не осмелился go спускаться по кроличьей норе, так как считал, что react-player по каким-то причинам требует этих плагинов.
2. Удалить @babel/plugin-proposal-class-properties из /react-player/package.json зависимости от разработчиков.
   • Результаты: та же ошибка
3. Установить @babel/plugin-proposal-class-properties в root package.json.
   • Результаты: та же ошибка
4. Удалите все установки Babel 6 и попробуйте установить их аналоги Babel 7.
   • Результаты: ад зависимости, так как некоторые из зависимостей Babel 6 устарели, и большинство результатов больше не распознавали 'react' как модуль.

Здесь сценарии для запуска в режиме разработки и построения:

  "scripts": {
    "start": "cross-env NODE_ENV=development webpack-dev-server --mode development --hot  --env.NODE_ENV=development --env.production=false --progress --config=webpack.dev.js",
    "build": "cross-env NODE_ENV=production webpack --mode production --env.NODE_ENV=production --env.production --progress --hide-modules --config=webpack.prod.js"
  }

Файл webpack.prod.js:

var webpack = require("webpack");
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");

module.exports = require('./webpack.common.js');
delete module.exports.devtool;
module.exports.output.publicPath = 'http://example.com/';
module.exports.plugins.push(
  new webpack.DefinePlugin({
    'NODE_ENV': JSON.stringify('production'),
    'process.env.NODE_ENV': JSON.stringify('production')
  })
);
module.exports.optimization = {
  splitChunks: {
    cacheGroups: {
      chunks: "all",
      commons: {
        chunks: "initial",
        minChunks: 1,
        maxInitialRequests: 5, // The default limit is too small to showcase the effect
        minSize: 0
      },
      vendor: {
        test: /[\\/]node_modules[\\/]/,
        name: "vendors",
        chunks: "all",
        priority: 10,
        enforce: true
      }
    }
  },
  runtimeChunk: 'single',
  minimizer: [
    new UglifyJsPlugin({
      sourceMap: true // set to true if you want JS source maps
    }),
    new OptimizeCSSAssetsPlugin({})
  ]
};
module.exports.module.rules.forEach(rule => {
  delete rule.exclude;
  return rule;
});

module.exports.plugins.push(
  new MiniCssExtractPlugin({
    filename: "[name].css",
    chunkFilename: "[id].css"
  })
);

root package.json зависимости. Я попытался убрать те, которые, по моему мнению, скорее всего, не имеют отношения к сокращению. Нет одноранговых зависимостей.

"devDependencies": {
    ...,
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-plugin-lodash": "^3.3.4",
    "babel-plugin-transform-es3-member-expression-literals": "^6.22.0",
    "babel-plugin-transform-es3-property-literals": "^6.22.0",
    "babel-plugin-transform-react-remove-prop-types": "^0.4.18",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-polyfill": "^6.26.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "babel-preset-stage-3": "^6.24.1",
    "clean-webpack-plugin": "^0.1.19",
    ...,
    "extract-text-webpack-plugin": "^4.0.0-beta.0",
    "file-loader": "^1.1.11",
    "html-webpack-plugin": "^3.2.0",
    ...,
    "optimize-css-assets-webpack-plugin": "^4.0.3",
    ...,
    "uglifyjs-webpack-plugin": "^1.2.7",
    "webpack": "^4.15.1",
    "webpack-cli": "^3.0.8",
    "webpack-dev-server": "^3.1.4",
    "webpack-md5-hash": "0.0.6"
  },
  "dependencies": {
    ...,
    "dotenv-webpack": "^1.5.7",
    ...,
    "react": "^16.4.1",
    ...,
    "react-dom": "^16.4.1",
    ...,
    "react-hot-loader": "^4.3.12",
    ...,
    "react-player": "^1.7.0",
    ...
  }

И, наконец, файл react-player/package.json, который, как я считаю, является виновником, но я не верю, что должен редактировать это напрямую.

{
  "_args": [
    [
      "react-player@1.15.2",
      "/home/user/Documents/admin-portal"
    ]
  ],
  "_from": "react-player@1.15.2",
  "_id": "react-player@1.15.2",
  "_inBundle": false,
  "_integrity": "sha512-8KWo2ZQU9OnTx5Yp7eKRh/jGadSc436MOqJ+7c7RryfOXeuY938yZ2Osvh6bZY+etMWXDBHqXm14Vv9SoGb68g==",
  "_location": "/react-player",
  "_phantomChildren": {},
  "_requested": {
    "type": "version",
    "registry": true,
    "raw": "react-player@1.15.2",
    "name": "react-player",
    "escapedName": "react-player",
    "rawSpec": "1.15.2",
    "saveSpec": null,
    "fetchSpec": "1.15.2"
  },
  "_requiredBy": [
    "/"
  ],
  "_resolved": "https://registry.npmjs.org/react-player/-/react-player-1.15.2.tgz",
  "_spec": "1.15.2",
  "_where": "/home/user/Documents/admin-portal",
  "author": {
    "name": "Pete Cook",
    "email": "pete@cookpete.com",
    "url": "http://github.com/cookpete"
  },
  "ava": {
    "files": [
      "test/**/*",
      "!test/helpers"
    ],
    "require": [
      "@babel/register",
      "@babel/polyfill"
    ],
    "babel": {
      "compileAsTests": [
        "test/helpers/*"
      ]
    }
  },
  "babel": {
    "presets": [
      "@babel/preset-env",
      "@babel/preset-react"
    ],
    "plugins": [
      "react-hot-loader/babel",
      "@babel/plugin-proposal-class-properties"
    ],
    "env": {
      "test": {
        "plugins": [
          "istanbul"
        ]
      }
    }
  },
  "bugs": {
    "url": "https://github.com/CookPete/react-player/issues"
  },
  "dependencies": {
    "deepmerge": "^4.0.0",
    "load-script": "^1.0.0",
    "prop-types": "^15.7.2"
  },
  "description": "A React component for playing a variety of URLs, including file paths, YouTube, Facebook, Twitch, SoundCloud, Streamable, Vimeo, Wistia and DailyMotion",
  "devDependencies": {
    "@ava/babel": "^1.0.0",
    "@babel/cli": "^7.8.4",
    "@babel/core": "^7.8.4",
    "@babel/plugin-proposal-class-properties": "^7.5.5",
    "@babel/polyfill": "^7.4.4",
    "@babel/preset-env": "^7.8.4",
    "@babel/preset-react": "^7.0.0",
    "@babel/register": "^7.5.5",
    "@hot-loader/react-dom": "^16.9.0",
    "auto-changelog": "^1.15.0",
    "autoprefixer": "^9.6.1",
    "ava": "^3.1.0",
    "babel-eslint": "^10.0.2",
    "babel-loader": "^8.0.6",
    "babel-plugin-istanbul": "^6.0.0",
    "codecov": "^3.6.3",
    "cross-env": "^7.0.0",
    "css-loader": "^3.2.0",
    "enzyme": "^3.10.0",
    "enzyme-adapter-react-16": "^1.14.0",
    "file-loader": "^5.0.2",
    "html-webpack-plugin": "^3.2.0",
    "mini-css-extract-plugin": "^0.9.0",
    "nyc": "^15.0.0",
    "optimize-css-assets-webpack-plugin": "^5.0.3",
    "postcss-advanced-variables": "^3.0.0",
    "postcss-loader": "^3.0.0",
    "postcss-nested": "^4.1.2",
    "react": "^16.9.0",
    "react-dom": "^16.9.0",
    "react-hot-loader": "^4.12.11",
    "rimraf": "^3.0.1",
    "sanitize.css": "^11.0.0",
    "screenfull": "^5.0.0",
    "sinon": "^8.1.1",
    "snazzy": "^8.0.0",
    "standard": "^14.0.0",
    "style-loader": "^1.0.0",
    "webpack": "^4.39.2",
    "webpack-cli": "^3.3.7",
    "webpack-dev-server": "^3.10.2"
  },
  "homepage": "https://github.com/CookPete/react-player",
  "keywords": [
    "react",
    "media",
    "player",
    "video",
    "audio",
    "youtube",
    "facebook",
    "twitch",
    "soundcloud",
    "streamable",
    "vimeo",
    "wistia",
    "dailymotion",
    "hls",
    "dash",
    "react-component"
  ],
  "license": "MIT",
  "main": "lib/ReactPlayer.js",
  "name": "react-player",
  "nyc": {
    "all": true,
    "include": "src",
    "sourceMap": false,
    "instrument": false,
    "report-dir": "./coverage",
    "temp-directory": "./coverage/.nyc_output",
    "reporter": [
      "text",
      "html"
    ]
  },
  "peerDependencies": {
    "react": "*"
  },
  "postcss": {
    "plugins": {
      "autoprefixer": {},
      "postcss-advanced-variables": {},
      "postcss-nested": {}
    }
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/CookPete/react-player.git"
  },
  "scripts": {
    "build:demo": "cross-env NODE_ENV=production webpack --config webpack/production.babel.js",
    "build:dist": "cross-env NODE_ENV=production webpack --config webpack/dist.babel.js",
    "build:lib": "cross-env NODE_ENV=production babel src -d lib --ignore src/demo",
    "build:standalone": "cross-env NODE_ENV=production webpack --config webpack/standalone.babel.js",
    "clean": "rimraf lib demo coverage",
    "lint": "standard --verbose | snazzy",
    "lint:fix": "standard --fix",
    "postpublish": "npm run clean",
    "prepublishOnly": "npm run build:lib && npm run build:dist",
    "preversion": "npm run lint && npm run test",
    "start": "webpack-dev-server --config webpack/config.babel.js",
    "test": "cross-env NODE_ENV=test ava",
    "test:codecov": "nyc report --reporter=json && codecov -f coverage/coverage-final.json",
    "test:coverage": "cross-env NODE_ENV=test nyc ava",
    "version": "auto-changelog -p && npm run build:dist && npm run build:standalone && git add CHANGELOG.md dist"
  },
  "standard": {
    "parser": "babel-eslint",
    "ignore": [
      "/dist/*"
    ]
  },
  "typings": "index.d.ts",
  "version": "1.15.2"
}

Редактировать: Вот файл root .babelrc:

{
    "presets": [
        "react",
        "es2015",
        "stage-3",

    ],
    "env": {
        "production": {
            "plugins": [
                "transform-react-remove-prop-types",
                "react-hot-loader/babel",
                "transform-es3-member-expression-literals",
                "transform-es3-property-literals"
            ]
        }
    }
}