Bundle targets fail when path contains spaces

[Judith de la Fuente]

It´s not a big issue when you know what´s happening as you can avoid it. But it would be nice if it works.
Similar to this old issue

Environment

Run the following in your terminal and copy the results here.

1. npx react-native --version: 5.0.1-alpha.2
2. npx react-native info:

System:
    OS: Windows 10 10.0.19042
    CPU: (8) x64 Intel(R) Core(TM) i7-8565U CPU @ 1.80GHz
    Memory: 2.10 GB / 15.76 GB
  Binaries:
    Node: 14.16.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.5 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 6.14.11 - C:\Program Files\nodejs\npm.CMD
    Watchman: Not Found
  SDKs:
    Android SDK:
      API Levels: 28, 29, 30
      Build Tools: 28.0.3, 29.0.2, 30.0.2
      System Images: android-28 | Google APIs Intel x86 Atom, android-29 | Intel x86 Atom, android-29 | Google APIs Intel x86 Atom, android-30 | Google APIs Intel x86 Atom, android-30 | Google Play Intel x86 Atom
      Android NDK: Not Found
    Windows SDK:
      AllowDevelopmentWithoutDevLicense: Enabled
      AllowAllTrustedApps: Enabled
      Versions: 10.0.18362.0, 10.0.19041.0
  IDEs:
    Android Studio: Version  4.1.0.0 AI-201.8743.12.41.7042882
    Visual Studio: 16.8.31019.35 (Visual Studio Community 2019)
  Languages:
    Java: 1.8.0_211 - C:\Program Files\Java\jdk1.8.0_211\bin\javac.EXE        
  npmPackages:
    @react-native-community/cli: Not Found
    react: 17.0.1 => 17.0.1
    react-native: 0.64.0 => 0.64.0
    react-native-windows: ^0.64.0-0 => 0.64.3
  npmGlobalPackages:
    *react-native*: Not Found

• Target Platform Version(s): 10.0.18362.0
• Target Device(s): Desktop
• Visual Studio Version: Microsoft Visual Studio Community 2019
• Build Configuration: Release

Steps To Reproduce

0. Create a folder that contain spaces on its name. For example: C:/Code/React Native
1. Create new app using latest version and typescript running:
   npx react-native init MyTSApp --template react-native-template-typescript cd MyTSApp
2. Move to folder with cd MyTsApp and run npx react-native-windows-init --overwrite --language cs
3. Install dependencies running yarn
4. Try creating an App Package. Right-click project > Publish > Create App Packages
   • create new certificate an choose Release

Expected Results

It should create the App Package but it fails.

Snack, code example, screenshot, or link to a repository:

Error:

• Error: EEXIST: file already exists, mkdir 'C:\Code\React'
• The command "npx --no-install react-native bundle --platform windows --entry-file index.js --bundle-output C:\Code\React Native\samplepp\windows\samplepp\Bundle\index.windows.bundle --assets-dest C:\Code\React Native\samplepp\windows\samplepp\Bundle --dev false --reset-cache --sourcemap-output C:\Code\React Native\samplepp\windows\samplepp\bin\x86\Release\sourcemaps\react\index.windows.bundle.map " exited with code 1. samplepp
• Note: It created a file with the first block of the text of the folder "React Native" -> " React", at the same level of that folder: C: in our sample. content of the file starts with:

{"version":3,"sources":["__prelude__","C:\\code\\React Native....

Error when trying to create de package

[Nick Gerleman]

Seems like we need some extra quotes around input with possible spaces in our MSBuild targets running bundle commands.

[sibille]

Thanks for looking into this, is there a possibility to back-port this to 0.64?

[Ethan Richardson]

Please reopen, this is still not working as of RN 0.65
#7678 (comment)

[Nick Gerleman]

New regression in 0.65. Issue is in the dependencies script, according to the screenshot. cc @asklar

[Chris Glein]

Worth adding a regression test that has a space so we catch issues like this earlier.

[Alexander Sklar]

The bug is not in the dependencies script (the error is that the dependencies script cannot be run). The bug is in the doctor/healthcheck code:

https://github.com/microsoft/react-native-windows/blob/main/packages/%40react-native-windows/cli/src/healthChecks.ts#L18-L22