Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

Tree shaking: getNativeInjectionCode emits raw ESM, hermesc fails with 'requires module mode'

Đang mở
  • Có gì không ổn?
#414 2 bình luận 0 reaction 0 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 3 ngày

@shin4141 đang làm issue này rồi.

Từ ngày 14/8/2026.

  • #419 của @shin4141 — đang mở

Đánh giá

Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức phù hợp với người mới
18/100
Loại issue
Lỗi
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Đình trệ
Công nghệ
react-native, typescript
Lĩnh vực
build-system, mobile-dev

Hướng nghiên cứu

Start with the getNativeInjectionCode function in the injection-code module, which emits the virtual module as an ESM string. Check PR #419, which is already open against this issue, before doing anything else. To reproduce, run the Expo export with the two tree-shaking flags and confirm the hermesc 'requires module mode' error. Done means that build compiles to bytecode with the flags on and the injection module survives the optimize-graph pass.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

auto-triaged bug confirmed needs-deep-triage
Summary

getNativeInjectionCode() emits its virtual module as a raw ESM string. Under Expo's experimental Metro tree shaking the serializer re-emits modules from their ESM form, so that module reaches the concatenated bundle with import/export intact. hermesc compiles the bundle in script mode, so both statements are hard errors and no production build can be produced.

Versions
  • react-native-css 3.0.7
  • nativewind 5.0.0-preview.4
  • expo 57.0.1, @expo/cli 57.0.13, @expo/metro-config 57.0.7
  • metro 0.84.4, react-native 0.86.0
Reproduction
EXPO_UNSTABLE_METRO_OPTIMIZE_GRAPH=1 EXPO_UNSTABLE_TREE_SHAKING=1 \
  npx expo export --platform android

Failed to generate Hermes bytecode for: node_modules/expo-router/entry.js
index.js:844745:1: error: 'import' statement requires module mode
index.js:853525:1: error: 'export' statement requires module mode
hermesc ... exited with non-zero code: 2

Adding --no-bytecode succeeds, and running hermesc by hand on that output pins it to a single line:

entry-<hash>.js
5663:14:     error: 'import' statement requires module mode
5663:128908: error: 'export' statement requires module mode

That line:

"use strict";import{StyleCollection}from"react-native-css/native-internal";
StyleCollection.inject({s:[["pointer-events-auto",...]]});
...
},5259,[244]);export{};
Cause

dist/commonjs/metro/injection-code.js:

function getNativeInjectionCode(cssFilePaths, values) {
  const importStatements = cssFilePaths.map(f => `import "${f}";`).join("\n");
  const contents = values.map(v => `StyleCollection.inject(${JSON.stringify(v)});`).join("\n");
  return Buffer.from(
    `import { StyleCollection } from "react-native-css/native-internal";\n` +
    `${importStatements}\n${contents};export {};`
  );
}

Without the flags this synthetic source is transformed to CJS like any other module, so the problem is invisible. With EXPO_UNSTABLE_METRO_OPTIMIZE_GRAPH + EXPO_UNSTABLE_TREE_SHAKING it is not.

Ruled out
Hypothesis Test Result
Expo Atlas instrumentation perturbs the serializer reran with EXPO_ATLAS unset same failure
Only multi-platform exports affected Android alone same failure
The bundle is fine, bytecode step at fault ran hermesc by hand on --no-bytecode output same two errors, so the bundle really does contain ESM

Unrelated to expo/expo#41620 — the build fails at bytecode generation, well before an app runs.

Impact

Measured on a production app, comparing plain JS both ways so the two sides are like-for-like:

Android bundle Bytes
Baseline 15,968,353
Tree-shaken 13,007,862
Delta -2,960,491 (-18.54%)

Module count is 7,828 either way, so this is dead-export elimination inside modules. That 18.54% is unreachable for any app using this package until the injection module survives the pass.

Possible fix

Emit the injection module as CJS, or register it so the optimize-graph pass runs it through the ESM to CJS transform before concatenation. Happy to test a patch.

Ngôn ngữ chính
TypeScript
Star
166
Fork
45
Merge trung bình
13 ngày 14 giờ
Pull request đã merge (30 ngày)
1

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của nativewind/react-native-css

Tất cả issue của nativewind/react-native-css

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.