javascript - 无法检测到减速器。面临以下错误 - '您可能需要适当的加载程序来处理此文件类型'

Question

我正在创建一个由 Redux 和 React Router 提供支持的示例 React 应用程序。React 的版本是 17.0.2，Redux 是 4.1.0。但是，我在输入时遇到以下错误npm start：

ERROR in ./node_modules/redux/es/redux.js 433:9
Module parse failed: Unexpected token (433:9)
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
| }
| 
> function assertReducerShape(reducers) {
|   Object.keys(reducers).forEach(function (key) {
|     var reducer = reducers[key];
 @ ./src/store/store.js 1:0-79 4:70-77 5:12-23 5:24-39 7:25-40
 @ ./src/index.js 5:0-34 8:9-14

这是 webpack.config.js：

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');

const SRC_DIR = 'src';
const DES_DIR = 'build';

module.exports = {
    entry: path.join(__dirname, SRC_DIR, 'index.js'),
    output: {
        path: path.join(__dirname, DES_DIR),
        filename: 'index.bundle.js',
        publicPath: '/'
    },
    devtool: 'source-map',
    mode: process.env.NODE_ENV || 'development',
    resolve: {
        modules: [
            path.join(__dirname, SRC_DIR), 'node_modules'
        ]
    },
    devServer: {
        contentBase: path.join(__dirname, SRC_DIR),
        historyApiFallback: true,
        open: true
    },
    module: {
        rules: [
            {
                test: /\.(js|jsx)$/,
                exclude: /node_modules/,
                use: ['babel-loader']
            },
            {
                test: /\.plain\.css$/,
                use: ['style-loader', 'css-loader']
            },
            {
                test: /^(?!.*?\.plain).*\.(css|scss)$/,
                use: [
                    {
                        loader: 'style-loader'
                    },
                    {
                        loader: 'css-loader',
                        options: {
                            sourceMap: true,
                            importLoaders: 1,
                            modules: {
                                localIdentName: "[local]__[hash:base64:5]"
                            }
                        }
                    },
                    {
                        loader: 'sass-loader'
                    }
                ]
            },
            {
                test: /\.(jpg|jpeg|png|gif|mp3|svg)$/,
                use: ['file-loader']
            }
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: path.join(__dirname, SRC_DIR, 'index.html'),
            filename: 'index.html'
        })
    ]
}

这是 store.js

import {
    createStore, combineReducers,
    compose, applyMiddleware
} from 'redux';
import thunk from 'redux-thunk';

import moviesReducer from './reducers/moviesReducer.js';

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

const store = createStore(
    combineReducers({
        movies: moviesReducer
    }),
    {},
    composeEnhancers(
        applyMiddleware(thunk)
    )
);

export default store;

这是reducer文件：

const initialState = {};

const reducer = (state=initialState, action) => {
    switch(action.type) {
        default: return state;
    }
}

export default reducer;

我的其他项目似乎在相同版本的 React 和 Redux 上运行良好。但不知何故，这个项目失败了。谁能帮我？

标签： javascriptreactjswebpackreduxreact-redux