我正在尝试打包应用“x”并在另一个应用“y”中使用它。这是我的设置：
x/package.json：
{
"name": "x",
"version": "0.0.1",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"antd": "^5.8.6",
"react": "^18.2.0",
"react-copy-to-clipboard": "^5.1.0",
"react-dom": "^18.2.0",
"react-markdown": "^8.0.7",
"react-scripts": "5.0.1",
"react-scroll": "^1.8.9",
"react-syntax-highlighter": "^15.5.0",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"@babel/plugin-proposal-private-property-in-object": "^7.21.11"
},
"exports": {
"./components/": "./src/components/"
}
}字符串
y/package.json：
{
"name": "y",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4",
"x": "file:x-0.0.1.tgz"
},
"scripts": {
"start": "react-scripts start",
"build": "INLINE_RUNTIME_CHUNK=false react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"@babel/plugin-proposal-private-property-in-object": "^7.21.11"
}
}型
我使用npm pack来打包“x”应用程序，并通过将其添加到y/package.json中的“dependencies”部分来安装它。
安装工作正常，但当我尝试启动“y”应用程序时，我得到：
Support for the experimental syntax 'jsx' isn't currently enabled型
在“X”包里的代码上。
我做错了什么？
2条答案
按热度按时间92vpleto1#
你的问题中提到的项目似乎类似于Monorepo架构，这意味着对多个应用程序使用单个repo。
Lerna是一个用于引导，构建和发布软件包的工具。它有助于简单地管理多个应用程序。它允许您轻松管理Monorepo中的软件包的版本控制，依赖关系和发布。Lerna Monorepo结构可能类似于以下内容：
字符串
首先你可以初始化Lerna：
型
然后创建Lerna包：
型
然后添加依赖项：
型
然后构建、测试和发布。
型
通过使用Monorepos，开发人员可以在包之间共享代码和依赖关系，版本控制和发布包并轻松管理依赖关系。
供您参考：
How to? Resolve multiple React apps to same 'react' package PATH using webpack/lerna
https://dev.to/danireptor/introduction-to-monorepo-in-react-1b3a的
3okqufwl2#
确保根项目中的**.babelrc**具有正确的react jsx配置文件
字符串
而您的tsconfig.json支持
型
如果错误仍然存在，请在根目录中创建一个babel.js文件，并在那里设置babel.js。