我有一个客户端运行良好的应用程序(使用 Webpack/Babel 进行转译和编译(。
我正在尝试使用 Node 渲染此应用程序服务器端,但收到此错误:
TypeError: C:/[PROJECT_PATH]/src/_base/common/components/general/AComponent.js: Property value expected type of string but got null
at Object.validate (C:[PROJECT_PATH]node_modulesbabel-typeslibdefinitionsindex.js:153:13)
at validate (C:[PROJECT_PATH]node_modulesbabel-typeslibindex.js:269:9)
at Object.builder (C:[PROJECT_PATH]node_modulesbabel-typeslibindex.js:222:7)
at File.<anonymous> (C:[PROJECT_PATH]node_modulesbabel-corelibtransformationfileindex.js:329:56)
at File.addImport (C:[PROJECT_PATH]node_modulesbabel-corelibtransformationfileindex.js:336:8)
at C:[PROJECT_PATH]node_modulesbabel-plugin-react-transformlibindex.js:257:46
at Array.map (native)
at ReactTransformBuilder.initTransformers (C:[PROJECT_PATH]node_modulesbabel-plugin-react-transformlibindex.js:255:40)
at ReactTransformBuilder.build (C:[PROJECT_PATH]node_modulesbabel-plugin-react-transformlibindex.js:164:41)
at PluginPass.Program (C:[PROJECT_PATH]node_modulesbabel-plugin-react-transformlibindex.js:331:17)
它发生在导入的任何组件上。我知道组件本身可以工作,因为它们在客户端模式下工作。
这是我的索引.js(与客户端应用程序中的 babel 配置相同(:
require('babel-register')({
presets:["es2015", "stage-0",'react'],
highlightCode: false,
sourceMaps: "both",
env: {
development: {
plugins: [
'transform-decorators-legacy',
["react-transform", {
transforms: [{
imports: ['react'],
locals: ['module']
}]
}]
]
}
}
});
require('./renderer.js');
这是我的渲染器.js :
import React, { Component } from 'react'
import Router, {match, RoutingContext } from 'react-router'
// this works :
import AnyActions from 'path/to/actions/AnyActions'
// this don't
import AnyComponent from 'path/to/any/component'
其他一切都被注释掉了!
我尝试导入这个简单的AComponent:
import React, { Component, PropTypes } from 'react'
export default class AComponent extends Component {
render () { return (<p>Hello</p>)}
}
同样的错误!
我一定错过了一些明显的东西...但我没有看到!
问题是我的 Babel 的反应变换配置不正确:我指定了没有任何转换名称的导入和本地人......
删除这部分解决了我的问题。这是我的新索引.js :
require('babel-register')({
presets:["es2015", "stage-0",'react'],
highlightCode: false,
sourceMaps: "both",
env: {
development: {
plugins: [
'transform-decorators-legacy'
]
}
}
});
require('./renderer.js');