我有一个用nx生成的react原生应用程序。
我想使用应用程序中的资源库。
我们的目标是这样的:
import { image } from "@appname/shared/assets";
<Image source={image}/>
或:
<Image source={require('/assets/image.png')}/>
或者甚至:
import image from '../assets/image.png';
<Image source={image}/>
这些解决方案都不起作用,没有崩溃,但图像不显示。
问题:似乎没有react native的更新文档,所有的nx教程都过时了,并且不再适用于新的项目结构。
- 没有"angular.json",我可以在其中设置资源路径。
- project.json中的"run-android"执行器没有资产选项。
我只有一个办法能让它成功:
<Image source={require('./../../../../../apps/appname/src/assets/image.png')}/>
这意味着我必须使用react应用的assets文件夹的相对路径(从当前组件所在的lib),这违背了nx原则。
我的项目结构是这样的:
project/
├── apps/
| ├── appname
| ├── src
| ├── assets
| ├── image.png <= the image that can be shown
├── libs/
├─── components
| ├── src
| ├── lib
| ├── component.tsx <= component from which i want to display the image
├── shared
├── assets
├── image.png <= the image I want to use
任何帮助都很感激:)
1条答案
按热度按时间qeeaahzv1#
我试过用一个库,代码像
我觉得没问题。我应该看到没有任何特殊配置的图片。
我是这么做的:
1.通过运行创建资源库
nx g@nrwl/react-native:库资产--目录=共享
1.在根目录tsconfig.base.json的路径add下
"@应用程序名称/共享/资产/* ":["库/共享/资产/*"]
现在,在应用程序文件中,我可以使用require来包含png图像。