在Lerna上使用React [英] Using React with Lerna
问题描述
我正在尝试使用Lerna和React构建概念验证.
I am trying to build a proof-of-concept using Lerna and React.
这是存储库:
https://github.com/SeanPlusPlus/lerna-react
到目前为止,如果运行此命令,以上方法将起作用:
So far, the above works if you run this:
git clone git@github.com:SeanPlusPlus/lerna-react.git
cd lerna-react
lerna bootstrap
cd packages/app
yarn start
在 packages/app/src/App.js
中,我正在导入并渲染 Headline
组件(注意,我使用了 create-react-app 代码>创建此目录):
In packages/app/src/App.js
I am importing and rendering the Headline
component (note, I used create-react-app
to create this directory):
import React, { Component } from 'react';
import logo from './logo.svg';
import Headline from 'headline';
import './App.css';
class App extends Component {
render() {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<h1 className="App-title">Welcome to React</h1>
</header>
{ Headline }
</div>
);
}
}
export default App;
packages/headline/index.jsx 中的 Headline
组件正在使用 React.createElement
函数:
The Headline
component in packages/headline/index.jsx
is using the React.createElement
function:
import React from 'react';
// const Headline = () => (
// <h1>Hello Lerna + React</h1>
// )
const Headline = React.createElement('div', null,
React.createElement('h1', null, 'Hello Lerna')
)
export default Headline
而且,如您所见,返回JSX的函数已被注释掉.
And, as you can see, the function returning JSX is commented out.
...现在...如果我更新此文件以返回JSX:
... Now ... If I update this file to return JSX instead:
import React from 'react';
const Headline = () => (
<h1>Hello Lerna + React</h1>
)
export default Headline
我的应用返回此错误:
Failed to compile.
../headline/index.jsx
Module parse failed: Unexpected token (4:2)
You may need an appropriate loader to handle this file type.
|
| const Headline = () => (
| <h1>Hello Lerna + React</h1>
| )
如何从 Headline
组件中导出JSX?
How do I export JSX from my Headline
component?
推荐答案
知道了!
https://github.com/SeanPlusPlus/lerna-react/tree/react-babel
我需要安装babel并编译 headline
组件.
I needed to install babel and compile my headline
component.
这篇关于在Lerna上使用React的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!