2
我正在用打字稿重寫一些反應的服務器端渲染文件,並且我遇到了一個找到我的自定義組件的問題。爲什麼node.js無法找到其他打字稿React組件
路徑結構:
node_modules/
src/
page/Homepage.tsx
component/Layout.tsx
utility/
typings/
當node.js的解析Homepage.tsx
,它可以找到不過所有模塊node_modules
下像react
和memobind
,它未能找到我的組件Layout
。我的IDE phpstorm有沒有問題識別我的組件的位置,但是當我訪問該網頁它給:
Error: Cannot find module '../component/Layout'
at Function.Module._resolveFilename (module.js:470:15)
at Function.Module._load (module.js:418:25)
at Module.require (module.js:498:17)
at require (internal/module.js:20:19)
at Object.<anonymous> (/home/base/node/src/page/Homepage.tsx:5:1)
at Module._compile (module.js:571:32)
at loader (/home/base/node/node_modules/babel-register/lib/node.js:144:5)
at Object.require.extensions.(anonymous function) [as .js] (/home/base/node/node_modules/babel-register/lib/node.js:154:7)
at Module.load (module.js:488:32)
at tryModuleLoad (module.js:447:12)
at Function.Module._load (module.js:439:3)
at Module.require (module.js:498:17)
at require (internal/module.js:20:19)
at /home/base/node/socket.js:90:25
at Layer.handle [as handle_request] (/home/base/node/node_modules/express/lib/router/layer.js:95:5)
at next (/home/base/node/node_modules/express/lib/router/route.js:131:13)
Homepage.tsx:
import * as React from "react";
import memobind from 'memobind'
import {Layout} from '../component/Layout'
class Homepage extends React.Component<{},{}>{
render(){
return <Layout><h4>Hello!!!</h4></Layout>
}
}
module.exports = Homepage;
Layout.tsx:
import * as React from "react";
export class Layout extends React.Component<{},{}>{
render(){
return <div class="header">{this.props.children}</div>
}
}
當我從腳本中刪除組件Layout
一切工作正常。
tsconfig.json
{
"compilerOptions": {
"module": "commonjs",
"target": "es6",
"moduleResolution": "node",
"baseUrl": "src",
"removeComments": true,
"allowSyntheticDefaultImports": true,
"noImplicitAny": false,
"sourceMap": true,
"jsx": "react",
"experimentalDecorators": true,
"noLib": false,
"declaration": false
},
"exclude": [
"node_modules"
]
}
這是一個表明你也在使用Babel的堆棧跟蹤。目前還不清楚您正在使用的其他工具。你在使用babel-node嗎?你怎麼編譯這個?你如何運行? –