Как решить: Неверный объект конфигурации. Webpack был инициализирован с использованием объекта конфигурации, который не Javascript

Форум по Javascript
Ответить
Anonymous
 Как решить: Неверный объект конфигурации. Webpack был инициализирован с использованием объекта конфигурации, который не

Сообщение Anonymous »

У меня есть рабочий проект React + машинописный текст, который работает с Babel и Webpack. Когда я написал код, внезапно возникла эта ошибка:
«Неверный объект конфигурации. Веб-пакет был инициализирован с использованием объекта конфигурации, который не соответствует схеме API». ."
Эта ошибка возникла при попытке интегрировать файл .css. Я установил загрузчик стилей и CSS и поместил их в свой файл webpack.config.js.
Я не знаю, что делаю неправильно. Как мне заставить свой стиль работать?
webpack.config.js file:

const path = require("path")
const HtmlWebpackPlugin = require("html-webpack-plugin")

module.exports = {
entry: path.resolve(__dirname, "..", "./src/index.tsx"),
resolve: {
extensions: [".tsx", ".ts", ".js"]
},

module: {
rules: [
{
test: /\.(js|jsx|ts|tsx)$/,
exclude: /node_modules/,
use: [
{
loader: ["babel-loader", "ts-loader"]
}
]
},
{
test: /\.(css|scss)$/,
use: ["style-loader", "css-loader"]
}
]
},
output: {
path: path.resolve(__dirname, "..", "./dist"),
filename: "bundle.js"
},
mode: "development",

plugins: [
new HtmlWebpackPlugin({
template: path.resolve(__dirname, "..", "./src/index.html")
})
]
}

Мои devDependities также говорят, что установлены css-loader и style-loader.
package.json:

"name": "my-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"cra-template-typescript": "1.2.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-scripts": "5.0.1"
},
"devDependencies": {
"@babel/core": "^7.26.0",
"@babel/preset-env": "^7.26.0",
"@babel/preset-react": "^7.26.3",
"@types/react": "^17.0.0",
"@types/react-dom": "^17.0.26",
"babel-loader": "^9.2.1",
"css-loader": "^7.1.2",
"style-loader": "^4.0.0",
"typescript": "^4.0.0",
"webpack": "^5.97.1",
"webpack-cli": "^6.0.1"
},
"scripts": {
"start": "webpack serve --config webpack/webpack.config.js --open",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}

И здесь я импортирую файл
App.tsx file:

import "./styles.css"

export const App: React.FC = () => {
return (

React typescript webpack starter
Hier word uiteindelijk de cursus pagina gemaakt!

)
}


Подробнее здесь: https://stackoverflow.com/questions/793 ... ed-using-a
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»