В моем коде я импортирую index.css со строкой import './index.css'; в моем основном файле приложения. Тем не менее, когда я пытаюсь собрать приложение, я получаю следующую ошибку, хотя я знаю, что нет проблемы с самим файлом CSS:
ERROR in ./src/index.css 1:5
Module parse failed: Unexpected token (1:5)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> body {
| margin: 0;
| font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
Вот мой текущий webpack.config.js, Я не уверен, что отсутствует в нем или что я должен добавить к нему:
const HTMLPlugin = require('html-webpack-plugin');
const CopyPlugin = require('copy-webpack-plugin');
const path = require('path');
const ExtensionReloader = require('webpack-extension-reloader');
const ManifestVersionSyncPlugin = require('webpack-manifest-version-sync-plugin');
module.exports = {
entry: {
options: './src/options.js',
popup: './src/popup.js',
content: './src/content.js',
background: './src/background.js',
},
output: {
filename: '[name].js',
path: path.resolve(__dirname, 'build'),
},
resolve: {
extensions: ['.js', '.jsx', '.css'],
modules: [path.resolve(__dirname, 'src'), 'node_modules'],
alias: {
react: 'preact/compat',
'react-dom': 'preact/compat',
},
},
module: {
rules: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
use: [
{
loader: 'babel-loader',
},
],
},
{
test: /\.svg$/,
use: ['@svgr/webpack'],
},
],
},
plugins: [
new HTMLPlugin({
chunks: ['options'],
filename: 'options.html',
title: 'Options page title',
}),
new HTMLPlugin({
chunks: ['popup'],
filename: 'popup.html',
}),
new CopyPlugin([
{ from: './src/_locales/', to: './_locales' },
{ from: './src/assets', to: './assets' },
{ from: './src/manifest.json', to: './manifest.json' },
]),
new ExtensionReloader({
manifest: path.resolve(__dirname, './src/manifest.json'),
}),
new ManifestVersionSyncPlugin(),
],
optimization: {
minimize: true,
},
mode: 'production',
stats: 'minimal',
};