umijs / dumi

📖 Static Site Generator for component library development
https://d.umijs.org
MIT License
3.58k stars 1.18k forks source link

bug: 同一套配置 dev 正常运行 build 打包报错 #1977

Closed onlyling closed 7 months ago

onlyling commented 10 months ago

Version

2.2.14

OS Version

macOS 13.6.2

Node.js Version

18.19.0

Browser Version

119.0.6045.199

Link to minimal reproduction

https://github.com/hjfruit/react-native-xiaoshu/tree/doc-next

Steps to reproduce

## 安装依赖
yarn

## 开发模式正常
yarn doc

## 构建静态资源报错
yarn doc:github-build

What is expected?

  1. 文档有说明 dev、build 分别使用了什么方式打包,翻阅 umi、dumi,配置相关没有看到明显的说明
  2. 协助修复在 build 命令下打包失败

What is actually happening?

同一套配置,在不同的环境打包出现了差异。

Any additional comments? (optional)

yarn doc:github-build
yarn run v1.22.19
$ cross-env PUBLIC_PATH=xiaoshu-doc/ dumi build
info  - dumi v2.2.14
info  - Umi v4.0.89

✖ Webpack
  Compiled with some errors in 12.57s

[BABEL] Note: The code generator has deoptimised the styling of /Users/onlyling/fruits-chain/react-native-xiaoshu/.dumi/tmp-production/dumi/meta/atoms.ts as it exceeds the max of 500KB.
info  - Memory Usage: 1126.08 MB (RSS: 1344.44 MB)
fatal - Error: ERROR in ./src/result/icons/result-icon-empty.tsx 20:14-20
export 'SvgXml' (imported as 'SvgXml') was not found in 'react-native-svg' (possible exports: Circle, ClipPath, Defs, Ellipse, ForeignObject, G, Image, Line, LinearGradient, Marker, Mask, Path, Pattern, Polygon, Polyline, RadialGradient, Rect, Stop, Svg, Symbol, TSpan, Text, TextPath, Use, default)
 @ ./src/result/index.ts 3:0-50 12:13-22
 @ ./src/index.ts 41:0-45 41:0-45
 @ ./.dumi/app.tsx
 @ ./.dumi/tmp-production/core/plugin.ts 4:0-92 19:27-35
 @ ./.dumi/tmp-production/umi.ts

ERROR in ./src/result/icons/result-icon-empty.tsx 20:41-47
export 'SvgXml' (imported as 'SvgXml') was not found in 'react-native-svg' (possible exports: Circle, ClipPath, Defs, Ellipse, ForeignObject, G, Image, Line, LinearGradient, Marker, Mask, Path, Pattern, Polygon, Polyline, RadialGradient, Rect, Stop, Svg, Symbol, TSpan, Text, TextPath, Use, default)
 @ ./src/result/index.ts 3:0-50 12:13-22
 @ ./src/index.ts 41:0-45 41:0-45
 @ ./.dumi/app.tsx
 @ ./.dumi/tmp-production/core/plugin.ts 4:0-92 19:27-35
 @ ./.dumi/tmp-production/umi.ts

ERROR in ./src/result/icons/result-icon-error.tsx 20:14-20
export 'SvgXml' (imported as 'SvgXml') was not found in 'react-native-svg' (possible exports: Circle, ClipPath, Defs, Ellipse, ForeignObject, G, Image, Line, LinearGradient, Marker, Mask, Path, Pattern, Polygon, Polyline, RadialGradient, Rect, Stop, Svg, Symbol, TSpan, Text, TextPath, Use, default)
 @ ./src/error-boundary/index.tsx 11:0-64 69:39-54
 @ ./src/index.ts 21:0-60 21:0-60
 @ ./.dumi/app.tsx
 @ ./.dumi/tmp-production/core/plugin.ts 4:0-92 19:27-35
 @ ./.dumi/tmp-production/umi.ts

ERROR in ./src/result/icons/result-icon-error.tsx 20:41-47
export 'SvgXml' (imported as 'SvgXml') was not found in 'react-native-svg' (possible exports: Circle, ClipPath, Defs, Ellipse, ForeignObject, G, Image, Line, LinearGradient, Marker, Mask, Path, Pattern, Polygon, Polyline, RadialGradient, Rect, Stop, Svg, Symbol, TSpan, Text, TextPath, Use, default)
 @ ./src/error-boundary/index.tsx 11:0-64 69:39-54
 @ ./src/index.ts 21:0-60 21:0-60
 @ ./.dumi/app.tsx
 @ ./.dumi/tmp-production/core/plugin.ts 4:0-92 19:27-35
 @ ./.dumi/tmp-production/umi.ts

ERROR in ./src/result/icons/result-icon-warning.tsx 20:14-20
export 'SvgXml' (imported as 'SvgXml') was not found in 'react-native-svg' (possible exports: Circle, ClipPath, Defs, Ellipse, ForeignObject, G, Image, Line, LinearGradient, Marker, Mask, Path, Pattern, Polygon, Polyline, RadialGradient, Rect, Stop, Svg, Symbol, TSpan, Text, TextPath, Use, default)
 @ ./src/result/index.ts 5:0-54 14:15-26
 @ ./src/index.ts 41:0-45 41:0-45
 @ ./.dumi/app.tsx
 @ ./.dumi/tmp-production/core/plugin.ts 4:0-92 19:27-35
 @ ./.dumi/tmp-production/umi.ts

ERROR in ./src/result/icons/result-icon-warning.tsx 20:41-47
export 'SvgXml' (imported as 'SvgXml') was not found in 'react-native-svg' (possible exports: Circle, ClipPath, Defs, Ellipse, ForeignObject, G, Image, Line, LinearGradient, Marker, Mask, Path, Pattern, Polygon, Polyline, RadialGradient, Rect, Stop, Svg, Symbol, TSpan, Text, TextPath, Use, default)
 @ ./src/result/index.ts 5:0-54 14:15-26
 @ ./src/index.ts 41:0-45 41:0-45
 @ ./.dumi/app.tsx
 @ ./.dumi/tmp-production/core/plugin.ts 4:0-92 19:27-35
 @ ./.dumi/tmp-production/umi.ts

ERROR in ./src/text-input/text-input.tsx 251:58-76
export 'InputAccessoryView' (imported as 'InputAccessoryView') was not found in 'react-native' (possible exports: AccessibilityInfo, ActivityIndicator, Alert, Animated, AppRegistry, AppState, Appearance, BackHandler, Button, CheckBox, Clipboard, DeviceEventEmitter, Dimensions, Easing, FlatList, I18nManager, Image, ImageBackground, InteractionManager, Keyboard, KeyboardAvoidingView, LayoutAnimation, Linking, LogBox, Modal, NativeEventEmitter, NativeModules, PanResponder, Picker, PixelRatio, Platform, Pressable, ProgressBar, RefreshControl, SafeAreaView, ScrollView, SectionList, Share, StatusBar, StyleSheet, Switch, Text, TextInput, Touchable, TouchableHighlight, TouchableNativeFeedback, TouchableOpacity, TouchableWithoutFeedback, UIManager, Vibration, View, VirtualizedList, YellowBox, findNodeHandle, processColor, render, unmountComponentAtNode, unstable_createElement, useColorScheme, useLocaleContext, useWindowDimensions)
 @ ./src/text-input/index.ts 3:0-37 4:43-52
 @ ./src/index.ts 56:0-52 56:0-52
 @ ./.dumi/app.tsx
 @ ./.dumi/tmp-production/core/plugin.ts 4:0-92 19:27-35
 @ ./.dumi/tmp-production/umi.ts

webpack compiled with 7 errors
    at handler (/Users/onlyling/fruits-chain/react-native-xiaoshu/node_modules/@umijs/bundler-webpack/dist/build.js:82:79)
    at finalCallback (/Users/onlyling/fruits-chain/react-native-xiaoshu/node_modules/@umijs/bundler-webpack/compiled/webpack/index.js:62945:32)
    at /Users/onlyling/fruits-chain/react-native-xiaoshu/node_modules/@umijs/bundler-webpack/compiled/webpack/index.js:62962:13
    at Hook.eval [as callAsync] (eval at create (/Users/onlyling/fruits-chain/react-native-xiaoshu/node_modules/@umijs/bundler-utils/compiled/tapable/index.js:1:7682), <anonymous>:35:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/Users/onlyling/fruits-chain/react-native-xiaoshu/node_modules/@umijs/bundler-utils/compiled/tapable/index.js:1:4851)
    at onCompiled (/Users/onlyling/fruits-chain/react-native-xiaoshu/node_modules/@umijs/bundler-webpack/compiled/webpack/index.js:62960:21)
    at /Users/onlyling/fruits-chain/react-native-xiaoshu/node_modules/@umijs/bundler-webpack/compiled/webpack/index.js:63704:17
    at _next0 (eval at create (/Users/onlyling/fruits-chain/react-native-xiaoshu/node_modules/@umijs/bundler-utils/compiled/tapable/index.js:1:7682), <anonymous>:16:1)
    at eval (eval at create (/Users/onlyling/fruits-chain/react-native-xiaoshu/node_modules/@umijs/bundler-utils/compiled/tapable/index.js:1:7682), <anonymous>:26:1)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
fatal - A complete log of this run can be found in:
fatal - /Users/onlyling/fruits-chain/react-native-xiaoshu/node_modules/.cache/logger/umi.log
fatal - Consider reporting a GitHub issue on https://github.com/umijs/dumi/issues
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
PeachScript commented 10 months ago

补充一下具体报错信息

onlyling commented 10 months ago

补充一下具体报错信息

已补充。

PeachScript commented 9 months ago

应该是报错的依赖在 node_modules 下存在多个版本,dev 下 MFSU 会强制保留一个版本(可能正好是需要的版本)所以不会报错,dev 配置 mfsu: false 可以验证

onlyling commented 7 months ago

临时解决了,react-native-web 并没有到导出 InputAccessoryViewreact-native-svg 在 web 端没有导出 SvgXml,手动做一些修复。

// umi-fix/react-native-svg.js
export * from 'react-native-svg/src/ReactNativeSVG.web'

export const SvgXml = () => {}

// umi-fix/react-native.js
export * from 'react-native-web'

export const InputAccessoryView = () => {}
// .dumirc.ts
import { defineConfig } from 'dumi'

export default defineConfig({
  alias: {
    'react-native$': path.join(__dirname, 'umi-fix/react-native.js'),
    'react-native-svg$': path.join(__dirname, 'umi-fix/react-native-svg.js'),
  }
})