Redux模板模块Babel-Loader构建失败

Question

我正在使用redux.js.org基本教程学习Redux，在我添加了一个特性之前，一切都很好，现在我得到了这个错误。

我在这里读了很多帖子，它似乎与babel模块有关，但在我的例子中，我没有安装这个模块，因为它是教程使用的模板的一部分，而且它没有包含在我的package.json中，所以我不确定这是否是问题所在。

希望有人能看出我做错了什么。非常感谢。

​

​

这是我的package.json：

{
  "name": "redux-essentials-example",
  "version": "1.0.0",
  "private": true,
  "dependencies": {
    "@mswjs/data": "^0.8.4",
    "@reduxjs/toolkit": "^1.6.1",
    "@testing-library/jest-dom": "^5.16.1",
    "@testing-library/react": "^12.1.2",
    "@testing-library/user-event": "^13.5.0",
    "classnames": "^2.2.6",
    "date-fns": "^2.12.0",
    "faker": "^4.1.0",
    "miragejs": "^0.1.35",
    "mock-socket": "^9.0.3",
    "msw": "^0.36.3",
    "react": "^17",
    "react-dom": "^17",
    "react-redux": "^7.2.4",
    "react-router-dom": "^5.1.2",
    "react-scripts": "^4",
    "seedrandom": "^3.0.5",
    "txtgen": "^2.2.4"
  },
  "scripts": {
    "start": "react-scripts --openssl-legacy-provider start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "prettier": "^2.0.2"
  },
  "msw": {
    "workerDirectory": "public"
  }
}

这是我的postSlice.js：

import {createSlice} from '@reduxjs/toolkit'
import {nanoid} from '@reduxjs/toolkit'
import {sub} from 'date-fns'

const initialState = [
{
    id: '1', title: 'Primer post', content: 'Hola como va', date: sub(new Date(), {minutes: 10}).toISOString()
},
{
    id: '2', title: 'Segundo post', content: 'Comentando ando',date: sub(new Date(), {minutes: 5}).toISOString()
}]

const postsSlice = createSlice({
    name : 'posts',
    initialState,
    reducers: {
        postAdded(state, action){
            state.push(action.payload)
        },

        prepare(title, content, userId) {
            return {
                payload: {
                    id: nanoid(),
                    date: new Date().toISOString(),
                    title,
                    content,
                    user: userId
                }
        }

        }
        postUpdated(state, action) {
            const {id, title, content} = action.payload
            const existingPost = state.find(post => post.id === id)
            if (existingPost){
                existingPost.title = title
                existingPost.content = content
            }
        }
    }
})
export const {postAdded, postUpdated} = postsSlice.actions

export default postsSlice.reducer

Answer 1

错误是在准备()还原器之后的postSlice.js上，我忘记为下一个还原器函数postUpdated()添加逗号。