我有一个结合Expo/React Native + Next.js项目(原生+ web应用),基于Expo的说明(见指南,@expo/next-adapter,代码示例)。
源代码:https://github.com/tomsoderlund/reactnative-nextjs-template/pull/1
它工作得很好,直到我试图添加react-native-elements
;现在它给出了一个Webpack错误,当运行在Next.js与yarn dev
(它工作良好与React Nativeyarn dev:native
)。
我在next.config.js
中添加了新的模块到transpilePackages
。
错误信息:
./node_modules/react-native-ratings/dist/SwipeRating.js
Module parse failed: Unexpected token (171:43)
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
| const { imageSize, ratingCount, type, tintColor } = this.props;
| const { source } = TYPES[type];
> return times(ratingCount, index => <View key={index} style={styles.starContainer}>
| <Image source={source} style={{ width: imageSize, height: imageSize, tintColor }}/>
| </View>);
更新:next-transpile-modules
阅读完世博指南后:
你可能需要使用
next-transpile-modules
插件来编译某些第三方模块,以使它们工作(如Emotion)。
…我尝试将next-transpile-modules
添加到我的next.config.js
,但后来得知它是多余的:https://nextjs.org/blog/next-13-1#built-in-module-transpilation-stable
注意:next-transpile-modules
现在已经内置到Next.js: https://github.com/martpie/next-transpile-modules/releases/tag/the-end