@DaveGarrow

Почему webpack выдает You may need an appropriate loader to handle this file type?

Вопрос старый, как оказалось, но ни одно предложение решить его не проходит.
60e158a42dc0f632531042.png

Изначально выдает You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file.

Пробовал добавлять в конфиг
new webpack.ProvidePlugin({
	process: 'process/browser',
})

Все равно не работает

Пробовал на всякий случай и отдельно babel.config.json создать
{
	"presets": ["@babel/preset-react", "@babel/preset-env"],
	"plugins": ["@babel/plugin-transform-react-jsx", "@babel/plugin-transform-runtime"]
}


Сам конфиг такой
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
	entry: './src/index.js',
	output: {
		path: path.join(__dirname, '/dist'),
		filename: 'index-bundle.js',
	},
	module: {
		rules: [
			{
				test: /\.js$|jsx/,
				exclude: /node_modules/,
				use: {
					loader: 'babel-loader',
					options: {
						presets: ["@babel/preset-react", "@babel/preset-env"],
						plugins: ["@babel/plugin-transform-react-jsx", "@babel/plugin-transform-runtime"]
					},
				}
			},
			{
				test: /\.(css|scss|sass)$/,
				use: ['style-loader', 'css-loader', 'sass-loader'],
			},
		],
	},
	plugins: [
		new HtmlWebpackPlugin({
			template: './src/index.html',
		}),
	],
};


package.josn
{
	"name": "test",
	"version": "0.1.0",
	"private": true,
	"scripts": {
		"start": "webpack --mode development --watch",
		"build": "webpack --mode production"
	},
	"dependencies": {
		"@babel/plugin-syntax-jsx": "^7.14.5",
		"@babel/plugin-transform-react-jsx": "^7.14.5",
		"@babel/runtime": "^7.14.6",
		"babel-plugin-transform-runtime": "^6.23.0",
		"process": "^0.11.10",
		"react": "^17.0.2",
		"react-dom": "^17.0.2",
		"sass": "^1.35.1",
		"sass-loader": "^12.1.0"
	},
	"devDependencies": {
		"@babel/core": "^7.14.6",
		"@babel/plugin-transform-runtime": "^7.14.5",
		"@babel/preset-env": "^7.14.7",
		"@babel/preset-react": "^7.14.5",
		"babel-loader": "^8.2.2",
		"babel-plugin-add-module-exports": "^1.0.4",
		"css-loader": "^5.2.6",
		"html-webpack-plugin": "^5.3.2",
		"style-loader": "^3.0.0",
		"transform-runtime": "0.0.0",
		"webpack": "^5.41.0",
		"webpack-cli": "^4.7.2",
		"webpack-dev-server": "^3.11.2"
	}
}
  • Вопрос задан
  • 30 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы