Question

我不确定为什么我的项目给了我当我尝试正常启动时找不到存储错误。但是当我做start-dev时，它是devServer，它运行正常。可能更容易在代码中向您展示。

这是整个错误

Invariant Violation: Could not find "store" in either the context or props of "Connect(Layout)". Either wrap the root component in a <Provider>, or explicitly pass "store" as a prop to "Connect(Layout)".

的package.json

  "scripts": {
    "start": "cross-env NODE_ENV=production node_modules/.bin/babel-node --presets react,es2015 src/server.js",
    "start-dev": "npm run start-dev-hmr",
    "start-dev-single-page": "node_modules/.bin/http-server src/static",
    "start-dev-hmr": "node_modules/.bin/webpack-dev-server --progress --inline --hot --open",
    "build": "cross-env NODE_ENV=production node_modules/.bin/webpack -p"
  },
"dependencies": {
    "babel-cli": "^6.11.4",
    "babel-core": "^6.13.2",
    "babel-loader": "^6.2.5",
    "babel-plugin-react-html-attrs": "^2.0.0",
    "babel-preset-es2015": "^6.13.2",
    "babel-preset-react": "^6.11.1",
    "babel-preset-react-hmre": "^1.1.1",
    "cross-env": "^3.1.4",
    "css-loader": "^0.27.3",
    "ejs": "^2.5.1",
    "express": "^4.14.0",
    "jquery": "^3.2.0",
    "react": "^15.3.1",
    "react-dom": "^15.3.1",
    "react-redux": "^5.0.3",
    "react-router": "^2.8.1",
    "redux": "^3.6.0",
    "style-loader": "^0.14.1"
  },

reducer.js

const action_types = require('./action_types');
import json from 'json!../../lang.json';


const initialState = {
  content: json.en // Loads default language content (en) as an initial state
};

const reducer = function (state = initialState, action) {
  switch (action.type) {
    case action_types.SWITCH_LANGUAGE:
      return {
        content: json[action.language]
      };
    default:
      return state;
  }
};

module.exports = reducer;

AppRouter.js

import React from 'react';
import { Router, browserHistory } from 'react-router';
import routes from '../routes';
import Layout from './Layout';

import { Provider } from 'react-redux';
import { createStore } from 'redux';
const content = require('../Action/reducer');
const store = createStore(content);


export default class AppRoutes extends React.Component {
  render() {
    return (
      <Provider store={store}>
        <Router history={browserHistory} routes={routes} onUpdate={() => window.scrollTo(0, 0)}/>
      </Provider>
    );
  }
}

routes.js

import React from 'react'
import { Route, IndexRoute } from 'react-router'
import Layout from './components/Layout';
import IndexPage from './components/IndexPage';
import AthletePage from './components/AthletePage';
import Notfound from './components/Notfound';
import Pricing from './components/Pricing/Pricing'

const routes = (
  <Route path="/" component={Layout}>
    <IndexRoute component={IndexPage}/>
    <Route path="pricing" component={Pricing}/>
    <Route path="*" component={Notfound}/>
  </Route>
);

export default routes;

Layout.js

'use strict';

import React from 'react';
import { Link } from 'react-router';

// const actions = require('../Action/actions');
import * as actions from '../Action/actions';
import {connect} from 'react-redux';

class Layout extends React.Component {
  handleSwitchLang(targetLang) {
    this.props.switchLanguage(targetLang);
  }

  render() {
    let switchLanguage = this.props.switchLanguage;
    let content = this.props.content;
    return (
      <div className="app-container">
        some ui code
      </div>
    );
  }
}

function mapStateToProps(state) {
  return { content: state.content }
}

export default connect(mapStateToProps, actions)(Layout);

Server.js

    'use strict';

import path from 'path';
import { Server } from 'http';
import Express from 'express';
import React from 'react';
import { renderToString } from 'react-dom/server';
import { match, RouterContext } from 'react-router';
import routes from './routes';
import NotFoundPage from './components/NotFoundPage';

// initialize the server and configure support for ejs templates
const app = new Express();
const server = new Server(app);
app.set('view engine', 'ejs');
app.set('views', path.join(__dirname, 'views'));

// define the folder that will be used for static assets
app.use(Express.static(path.join(__dirname, 'static')));

// universal routing and rendering
app.get('*', (req, res) => {
  match(
    { routes, location: req.url },
    (err, redirectLocation, renderProps) => {

      // in case of error display the error message
      if (err) {
        return res.status(500).send(err.message);
      }

      // in case of redirect propagate the redirect to the browser
      if (redirectLocation) {
        return res.redirect(302, redirectLocation.pathname + redirectLocation.search);
      }

      // generate the React markup for the current route
      let markup;
      if (renderProps) {
        // if the current route matched we have renderProps
        markup = renderToString(<RouterContext {...renderProps}/>);
      } else {
        // otherwise we can render a 404 page
        markup = renderToString(<NotFoundPage/>);
        res.status(404);
      }

      // render the index template with the embedded React markup
      return res.render('index', { markup });
    }
  );
});

// start the server
const port = process.env.PORT || 3000;
const env = process.env.NODE_ENV || 'production';
server.listen(port, err => {
  if (err) {
    return console.error(err);
  }
  console.info(`Server running on http://localhost:${port} [${env}]`);
});

不变违规：找不到＆＃34;存储＆＃34;在＆＃34; Connect的上下文或道具中

0 个答案: