Import React in Node.js throws SyntaxError: Unexpected token export

Question

我正在尝试使用 Node.js 和 React 来实现 SSR https://github.com/babel/example-node-server as advised in the official Babel docs here http://babeljs.io/docs/usage/cli/#babel-node

为了开发，我正在使用 babel-node；对于生产，我想用 babel 和运行转译我的服务器 node:

package.json

"scripts": {
  "start": "node ./dist/server/index.js",
  "dev:server": "nodemon ./src/server/index.js -x babel-node",
  "build:server": "babel ./src/server -d ./dist/server --copy-files -s inline"
},
"babel": {
  "presets": [
    "env",
    "react",
    "stage-2"
  ],
  "plugins": [
    "transform-decorators-legacy"
  ]
}

服务器是用ES6语法写的：

src/server/index.js

import 'babel-polyfill'
import './config'
import Express from 'express'
import bootstrap from './bootstrap'

const app = Express()
bootstrap(app)

export default app

然后在某些路径中，我导入我的 React 组件以根据要求将其渲染到 HTML：

src/server/routes/admin.js

import { Router } from 'express'
import React from 'react'
import createHistory from 'history/createMemoryHistory'
import { renderToString } from 'react-dom/server'
import { Provider } from 'react-redux'
import { StaticRouter, matchPath } from 'react-router'
import configureStore from '../../../src/admin/store'
import routes from '../../../src/admin/routes'
import Root from '../../../src/admin/containers/Root'
// etc.

服务器尝试导入 React 组件时抛出错误

./src/admin/store/index.js:11
export default configureStore
^^^^^^

SyntaxError: Unexpected token export

我试过在服务端使用babel-register，可以用，但不建议在生产模式下使用，所以我宁愿不做。

此外，在检查构建的服务器代码时，我发现：

dist/server/routes/admin.js

var _store = require('../../../src/admin/store');

这意味着它仍在引用 src 文件夹。理想情况下，我想以某种方式将这些模块合并到构建的服务器代码中，这样我就可以安全地从生产环境中删除 src 文件夹，只留下 dist.

编辑

不同于

Answer 1

那是因为您只转译 ./src/server 而不是 ./src/admin。然后在 ./src/server 中你有 export 关键字没有被 Babel 翻译并且 export 关键字不被 Node 支持 - 要知道为什么，请看那些答案：

Is it ok to use Babel npm package for node.js server application
javascript - Why is there a spec for sync and async modules?
Exporting Node module from promise result

您需要转译所有使用 Node 本身不支持的语法的代码，而不仅仅是其中的一部分。

将这样的脚本添加到您的 package.json 可能会有所帮助，具体取决于您的 ./src 和 ./dist 的组织方式：

"build:all": "babel ./src -d ./dist --copy-files -s inline"

当然不知道 ./src 除了 server 和 admin 之外还有什么，很难给你一个具体的解决方案 - 但这是一个很好的起点。

Import React in Node.js throws SyntaxError: Unexpected token export