reactjs - 找不到模块提升非反应静态
问题描述
我正在通过创建一个 Blogpost 应用程序来练习 React Redux。我在创建新的帖子组件时遇到了问题。我已经安装了 axios,redux-promise。我已经安装了 react-router 4.0.0、react-router-dom 4.2.2、redux-form 6.6.3
1.这是我的 src/index.js
import React from "react";
import ReactDOM from "react-dom";
import { Provider } from "react-redux";
import { createStore, applyMiddleware } from "redux";
import { BrowserRouter, Route, Switch } from "react-router-dom";
import promise from "redux-promise";
import reducers from "./reducers";
import PostIndex from "./components/posts_index";
import PostsNew from "./components/posts_new";
const createStoreWithMiddleware = applyMiddleware(promise)(createStore);
ReactDOM.render(
<Provider store={createStoreWithMiddleware(reducers)}>
<BrowserRouter>
<div>
<Switch>
<Route path="/posts/new" component={PostsNew} />
<Route path="/" component={PostIndex} />
</Switch>
</div>
</BrowserRouter>
</Provider>,
document.querySelector(".container")
);
2.这是我的actions/index.js
import axios from "axios";
export const FETCH_POSTS = "FETCH_POSTS";
const ROOT_URL = "http://reduxblog.herokuapp.com/api";
const API_KEY = "?key=SHUVRO1234";
export function fetchPosts() {
const request = axios.get(`${ROOT_URL}/posts${API_KEY}`);
return {
type: FETCH_POSTS,
payload: request
};
}
3.这是reducers/index.js
import { combineReducers } from "redux";
import { reducer as formReducer } from "redux-form";
import PostsReducer from "./reducer_posts";
const rootReducer = combineReducers({
posts: PostsReducer,
form: formReducer
});
export default rootReducer;
4.这是动作减速器
import _ from "lodash";
import { FETCH_POSTS } from "../actions";
export default function(state = {}, action) {
switch (action.type) {
case FETCH_POSTS:
return _.mapKeys(action.payload.data, "id");
default:
return state;
}
}
5.这是显示错误的posts_new组件
import React, { Component } from "react";
import { Field, reduxForm } from "redux-form";
class PostsNew extends Component {
renderTitleField(field) {
return (
<div>
<input type="text" {...field.input} />
</div>
);
}
render() {
return (
<form>
<Field name="title" component={this.renderTitleField} />
</form>
);
}
}
export default reduxForm({ form: "PostsNewForm" })(PostsNew);
这是控制台中的错误
bundle.js:20326 Uncaught Error: Cannot find module "hoist-non-react-statics"
at webpackMissingModule (bundle.js:20326)
at Object.<anonymous> (bundle.js:20326)
at Object.invariant (bundle.js:20624)
at __webpack_require__ (bundle.js:20)
at Object.exports.__esModule (bundle.js:19501)
at __webpack_require__ (bundle.js:20)
at Object.<anonymous> (bundle.js:64)
at __webpack_require__ (bundle.js:20)
at Object.<anonymous> (bundle.js:47)
at __webpack_require__ (bundle.js:20)
请帮我解决这个错误
解决方案
只需运行“npm i raise-non-react-statics”希望它有所帮助
推荐阅读
- javascript - HTML/JavaScript - 为文本框输入激活键盘麦克风
- javascript - 我有这个“ throw new RangeError('BITFIELD_INVALID', bit);” 错误; 我只是找不到解决方案
- mysql - 从终端中的文件执行 MYSQL 命令
- c# - 如何在不知道底层记录类型的情况下在界面上使用关键字“with”?
- node.js - nest.js 构建抛出很多错误
- matlab - MATLAB中竞争性捕食者猎物模型的分岔图
- python - 从已排序的字典键中仅删除前导零
- php - PHP:如何检测函数中不正确的参数数量?
- c# - 为什么我不能跳?
- android - 活动结果 API 选择特定数量的文件