尝试在根目录外以expo形式导入外部通用组件

问题描述

这是通用组件

import React from "react";
// import { Text } from "react-native";
const PrintHello = () => {
  return <div> Hello Im working </div>;
};

export default PrintHello;
// import _ from "lodash";

这是文件夹结构

common/components

app1/src/components

app2/src

我遇到了这个错误

/Users/mac3/Documents/GitHub/curb-food/common/utils.js 4:9
Module parse Failed: Unexpected token (4:9)
You may need an appropriate loader to handle this file type,currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| // import { Text } from "react-native";
| const PrintHello = () => {
>   return <div> Hello Im working </div>;
| };
|

我尝试了所有 babel-loader 但没有任何效果

解决方法

文件类型应该是 .jsx 来处理 React 组件而不是 .js。此外，<div> 不是 React Native 组件，您应该使用 <Text>。如果您将文件名更改为 utils.jsx 并将您的代码替换为以下代码，它应该可以工作。

import React from "react";
import { Text } from "react-native";

const PrintHello = () => {
  return <Text> Hello Im working </Text>;
};