我正在尝试重新创建样板并设置一个新的开发ReactJS环境,后面使用this repo来模仿Create-React-App
。
我确保在继续进行更改之前,我可以在http://localhost:3000/
上看到默认登录页面。
以下是我走过的步骤:
src
文件夹中的所有文件npm install react-redux redux
index.js
文件夹中添加src
components
文件夹中添加reducers
,src
目录app.js
文件夹中添加src/components/
index.js
文件夹中添加src/reducers/
以下是文件的内容
SRC / index.js
import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import App from './components/app';
import reducers from './reducers';
const createStoreWithMiddleware = applyMiddleware()(createStore);
ReactDOM.render(
<Provider store={createStoreWithMiddleware(reducers)}>
<App />
</Provider>
, document.querySelector('.container'));
SRC /减速器/ index.js
import { combineReducers } from 'redux';
const rootReducer = combineReducers({
state: (state = {}) => state
});
export default rootReducer;
SRC /组件/ app.js
import React, { Component } from 'react';
export default class App extends Component {
render() {
return (
<div>React simple starter</div>
);
}
}
我在下面遇到错误
更新
根据反馈,我包括我的index.html
如下
的index.html
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/style/style.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/twbs/bootstrap/48938155eb24b4ccdde09426066869504c6dab3c/dist/css/bootstrap.min.css">
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAq06l5RUVfib62IYRQacLc-KAy0XIWAVs"></script>
</head>
<body>
<div class="container"></div>
</body>
<script src="/bundle.js"></script>
</html>
如果您使用react-create-app,它会生成一个HTML文件,其中没有document.querySelector('.container')
。而不是它,这个html文件有<div id="root"></div>
,所以你可以尝试从document.querySelector('.container')
更改为document.querySelector('#root')
。如果它没有帮助,请显示您的HTML文件。