Question

当我尝试读取包含路由器节点崩溃的反应文件时出错（我想构建站点地图，但即使我只是尝试使用console.log导出默认变量而且我收到此错误可能需要babel配置？）：

    redux\store.js:80 var store = (0, _redux.createStore)(_index2.default,
 defaultState, (0, _redux.compose)((0, _redux.applyMiddleware)
(_reduxThunk2.default), window.devToolsExtension ? window.devToolsExtension() :
 function (f) { ^

ReferenceError：未定义窗口

store.js代码。发生了错误

const store = createStore(
  rootReducer,
  defaultState,
  compose(
    applyMiddleware(thunk),
    window.devToolsExtension ? window.devToolsExtension() : f => f
  )
);

是否可以修复该错误？

react file test.js

require('es6-promise').polyfill();

import React from 'react';
import { render } from 'react-dom';
import { Provider } from 'react-redux';
import store, { history } from './redux/store';
import { Router, Route, IndexRoute } from 'react-router';
import App from './app';
....

const renderRouter = (<Provider store={store}>
      <Router history={history} >
        <Route path="/" component={App}>
.....
</Router>
</Prodiver
)

export default renderRouter;

站点地图文件

require('babel-register');

const renderRouter = require('./test').default;
console.log(renderRouter);

/*
const Sitemap = require('react-router-sitemap').default;

(
    new Sitemap(router)
        .build('https://www.omgomg.com')
        .save('./sitemap.xml')
);*/

Answer 1

假设您使用的是网络包，则可以通过将redux/store.js更改为

来解决您的问题

const store = createStore(
  rootReducer,
  defaultState,
  compose(
    applyMiddleware(thunk),
    global.devToolsExtension ? global.devToolsExtension() : f => f
  )
);

这将在Node.js运行时中运行，其中global已定义，而webpack将provide it in the browser。

另一个较少依赖于构建系统的解决方案是检查是否定义了window：

const HAS_DEVTOOLS = typeof window === 'object' &&
  typeof window.devToolsExtension === 'function';

const store = createStore(
  rootReducer,
  defaultState,
  compose(
    applyMiddleware(thunk),
    HAS_DEVTOOLS ? global.devToolsExtension() : f => f
  )
);

如何使用节点读取反应文件（带有jsx的ES6）以获取导出变量

1 个答案: