Ошибка при развертывании: аргумент типа ‘MiniCssExtractPlugin’ не может быть присвоен параметру типа ‘Plugin’

#reactjs #typescript #deployment #hadoop-yarn

#reactjs #typescript #развертывание #hadoop-yarn

Вопрос:

Я хочу развернуть проект Typescript / React. Я уже выполнил следующие шаги:

  • Создать ветку для развертывания
  • Установите gh-pages для запуска развернутого приложения
  • добавлена команда развертывания в виде скрипта в пакете json

После выполнения команды yarn deploy в консоли git отображается следующая ошибка:

     ERROR in C:UsersJorrit-BusinessSchoolmy-projectwebpackconfig.ts
[tsl] ERROR in C:UsersJorrit-BusinessSchoolmy-projectwebpackconfig.ts(29,5)
      TS2345: Argument of type 'MiniCssExtractPlugin' is not assignable to parameter of type 'Plugin'.
  

Код в webpackconfig.ts выглядит следующим образом:

 import bgImage from "postcss-bgimage";
import HtmlWebpackPlugin from "html-webpack-plugin";
import * as webpack from "webpack";
import * as path from "path";
const isProd = process.env.NODE_ENV === "production";
const isDev = !isProd;
import autoprefixer from "autoprefixer";
import MiniCssExtractPlugin from "mini-css-extract-plugin";
import OptimizeCSSAssetsPlugin from "optimize-css-assets-webpack-plugin";
import TerserPlugin from "terser-webpack-plugin";
import ReactRefreshWebpackPlugin from "@pmmmwh/react-refresh-webpack-plugin";
import svgoConfig from "@triply/utils/lib/svgo";
import { BundleAnalyzerPlugin } from "webpack-bundle-analyzer";
import { compact } from "lodash";
export const analyzeBundle = process.env["ANALYZE_BUNDLE"] === "true";

const plugins: webpack.Plugin[] = [
  new webpack.DefinePlugin({
    __DEVELOPMENT__: isDev,
  }),
];

if (isDev) {
  plugins.push(new ReactRefreshWebpackPlugin());
  //ignore these, to avoid infinite loops while watching
  plugins.push(new webpack.WatchIgnorePlugin([/.js$/, /.d.ts$/]));
} else {
  plugins.push(
    new MiniCssExtractPlugin({
      filename: "[name].min.css",
      chunkFilename: "[id].css",
    })
  );
} ...
  

Сам файл кода не показывает ошибок. Я что-то здесь упускаю? Примечание: я уже пытался переустановить MiniCssExtractPlugin зависимость (v0.9.0).

Ответ №1:

Я знаю, что прошло некоторое время с тех пор, как был открыт этот поток без ответа, но если это все еще проблема (или для тех, кто может столкнуться с этим):

Проблема была решена для меня путем обновления @types/mini-css-extract-plugin до версии 1.2.1 . Похоже, что для предыдущих версий это была известная проблема.