[0.64] Fix MSBuild Bundling When Path Contains Spaces (#7678)

* Fix MSBuild Bundling When Path Contains Spaces

Fixes #7597

We're passing raw strings into the exec string for running commands from MSBuild. Paths with spaces will be interpreted as multiple CLI args. Wrap paths in quotes to fix paths with spaces.

* Change files

Co-authored-by: Andrew Coates <30809111+acoates-ms@users.noreply.github.com>

Author: NickGerleman

Diff for: change/react-native-windows-2f993c0c-f439-4e9d-96b3-8392c0eadee4.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Fix MSBuild Bundling When Path Contains Spaces",
+  "packageName": "react-native-windows",
+  "email": "ngerlem@microsoft.com",
+  "dependentChangeType": "patch"
+}

Diff for: vnext/PropertySheets/Autolink.props

@@ -9,7 +9,7 @@
     <RunAutolinkCheck Condition="'$(RunAutolinkCheck)' == ''">true</RunAutolinkCheck>
     <AutolinkCommand Condition="'$(AutolinkCommand)' == ''">npx react-native autolink-windows</AutolinkCommand>
     <AutolinkCommandWorkingDir Condition="'$(AutolinkCommandWorkingDir)' == ''">$([MSBuild]::GetDirectoryNameOfFileAbove($(ProjectDir), 'package.json'))</AutolinkCommandWorkingDir>
-    <AutolinkCommandArgs Condition="'$(AutolinkCommandArgs)' == '' And '$(SolutionPath)' != '' And '$(ProjectPath)' != ''">--check --sln $([MSBuild]::MakeRelative($(AutolinkCommandWorkingDir), $(SolutionPath))) --proj $([MSBuild]::MakeRelative($(AutolinkCommandWorkingDir), $(ProjectPath)))</AutolinkCommandArgs>
+    <AutolinkCommandArgs Condition="'$(AutolinkCommandArgs)' == '' And '$(SolutionPath)' != '' And '$(ProjectPath)' != ''">--check --sln "$([MSBuild]::MakeRelative($(AutolinkCommandWorkingDir), $(SolutionPath)))" --proj "$([MSBuild]::MakeRelative($(AutolinkCommandWorkingDir), $(ProjectPath)))"</AutolinkCommandArgs>
     <AutolinkCommandArgs Condition="'$(AutolinkCommandArgs)' == ''">--check</AutolinkCommandArgs>
   </PropertyGroup>
 

Diff for: vnext/PropertySheets/Bundle.Common.targets

@@ -13,14 +13,14 @@
       <MakeDir Directories="$(BundleContentRoot)" />
       <MakeDir Directories="$(BundleSourceMapDir)" />
       <Message Importance="High" Text="Running [$(BundleCliCommand) --platform windows --entry-file $(BundleEntryFile) --bundle-output $(BundleOutputFile) --assets-dest $(BundleContentRoot) --dev $(UseDevBundle) --reset-cache --sourcemap-output $(PackagerSourceMap) $(BundlerExtraArgs)] to build bundle file." />
-      <Exec Command="$(BundleCliCommand) --platform windows --entry-file $(BundleEntryFile) --bundle-output $(BundleOutputFile) --assets-dest $(BundleContentRoot) --dev $(UseDevBundle) --reset-cache --sourcemap-output $(PackagerSourceMap) $(BundlerExtraArgs)" ConsoleToMSBuild="true" WorkingDirectory="$(BundleCommandWorkingDir)" />
+      <Exec Command='$(BundleCliCommand) --platform windows --entry-file "$(BundleEntryFile)" --bundle-output "$(BundleOutputFile)" --assets-dest "$(BundleContentRoot)" --dev $(UseDevBundle) --reset-cache --sourcemap-output "$(PackagerSourceMap)" $(BundlerExtraArgs)' ConsoleToMSBuild="true" WorkingDirectory="$(BundleCommandWorkingDir)" />
   </Target>
 
   <!-- See https://github.com/facebook/react-native/blob/07d090dbc6c46b8f3760dbd25dbe0540c18cb3f3/react.gradle#L190 for reference -->
   <Target Name="CompileHermesBytecode" AfterTargets="MakeBundle" Condition="'$(UseBundle)' == 'true' AND '$(UseHermes)' == 'true'">
-    <Exec Command="$(HermesCompilerCommand) -emit-binary -out $(BundleOutputFile).hbc $(BundleOutputFile) $(HermesCompilerFlags) -output-source-map" ConsoleToMSBuild="true" WorkingDirectory="$(BundleCommandWorkingDir)" />
+    <Exec Command='$(HermesCompilerCommand) -emit-binary -out "$(BundleOutputFile).hbc" "$(BundleOutputFile)" $(HermesCompilerFlags) -output-source-map' ConsoleToMSBuild="true" WorkingDirectory="$(BundleCommandWorkingDir)" />
     <Move SourceFiles="$(BundleOutputFile).hbc" DestinationFiles="$(BundleOutputFile)" />
     <Move SourceFiles="$(BundleOutputFile).hbc.map" DestinationFiles="$(HermesSourceMap)" />
-    <Exec Command="node $(ReactNativePackageDir)\scripts\compose-source-maps.js $(PackagerSourceMap) $(HermesSourceMap) -o $(BundleSourceMap)" ConsoleToMSBuild="true" WorkingDirectory="$(BundleCommandWorkingDir)" />
+    <Exec Command='node "$(ReactNativePackageDir)\scripts\compose-source-maps.js" "$(PackagerSourceMap)" "$(HermesSourceMap)" -o "$(BundleSourceMap)"' ConsoleToMSBuild="true" WorkingDirectory="$(BundleCommandWorkingDir)" />
   </Target>
 </Project>