Handling of Special Characters in Asset File Names Causes Build Failures

[fredrikburmester]

Hi there,

I've encountered an issue with Metro where asset file names containing special characters (specifically the ampersand &) cause the build process to fail. An example of this is when using the font file named LCDAT&TPhoneTimeDate.ttf, which required renaming to LCDAT.ttf to resolve the issue.

This seems to be a parsing or handling error related to special characters in file names, which might not be adequately handled or escaped during the build process.

Steps to Reproduce:

1. Include a file with an ampersand (&) in the name, e.g., LCDAT&TPhoneTimeDate.ttf, in the assets directory.
2. Run npx expo start
3. Wait for iOS bundling to finish
4. Observe the error

Expected Behavior:
The build process should handle file names with special characters without failing, or there should be clear documentation on file name restrictions.

Actual Behavior:
The build fails (or behaves unexpectedly), and the file must be renamed to exclude special characters for successful processing.

Is this a known limitation with Metro's file handling, or is this something that can be improved either in functionality or documentation?

Thanks for looking into this!

This issue was prompted by troubleshooting during development, where renaming the file resolved the build issues.

[robhogan]

Hi @fredrikburmester, thanks for the report. Just to clarify, what do you mean when you say "run the build process"? There are a bunch of steps in resolving and then bundling/serving assets and they vary across iOS/Android and between dev/prod - it'd help narrow down the problem.

Also:

• Is this with Expo or Community CLI, and what version?
• What is the build failure you see, exactly? An error message at build time, or a runtime issue with the missing asset?

[fredrikburmester]

Hi @robhogan, sorry if I was unclear. After compiling the application with eas build --profile development --platform ios --local and running it with npx expo start I get this error after the iOS bundling.

You can see in the image that the path to the font is not outputted properly, but I've also submitted an issue for that. But you can find the path in the code below. As you can see, the font file path is cut off right before the & sign.

iOS Bundled 28743ms (node_modules/expo-router/entry.js)
Error: invalid asset file path: ./assets/fonts/LCDAT
    at Object.parse (/Users/fredrikburmester/Documents/GitHub/klubbsegling-app/node_modules/metro/src/node-haste/lib/AssetPaths.js:44:11)
    at getAsset (/Users/fredrikburmester/Documents/GitHub/klubbsegling-app/node_modules/metro/src/Assets.js:192:32)
    at Server._processSingleAssetRequest (/Users/fredrikburmester/Documents/GitHub/klubbsegling-app/node_modules/metro/src/Server.js:310:26)
    at Server._processRequest (/Users/fredrikburmester/Documents/GitHub/klubbsegling-app/node_modules/metro/src/Server.js:392:18)
    at Server.processRequest (/Users/fredrikburmester/Documents/GitHub/klubbsegling-app/node_modules/metro/src/Server.js:332:10)
    at /Users/fredrikburmester/Documents/GitHub/klubbsegling-app/node_modules/@expo/cli/src/start/server/metro/instantiateMetro.ts:204:22
    at call (/Users/fredrikburmester/Documents/GitHub/klubbsegling-app/node_modules/connect/index.js:239:7)
    at next (/Users/fredrikburmester/Documents/GitHub/klubbsegling-app/node_modules/connect/index.js:183:5)
    at /Users/fredrikburmester/Documents/GitHub/klubbsegling-app/node_modules/@expo/cli/src/start/server/middleware/ContextModuleSourceMapsMiddleware.ts:29:7
    at call (/Users/fredrikburmester/Documents/GitHub/klubbsegling-app/node_modules/connect/index.js:239:7)

---

expo: ~50.0.17
react-native: 0.73.6

iPhone 15 Pro, iOS 17.4 simulator