shirakaba · October 30, 2024 05:31 · Oct 30, 2024 · Oct 22, 2024 · Oct 22, 2024 · Oct 22, 2024
diff --git a/React Native Windows handbook.md → ...indows and React Native macOS handbook.md b/React Native Windows handbook.md → ...indows and React Native macOS handbook.md
@@ -8,10 +8,12 @@ See the new `init-windows` command in their `@next` [docs](https://microsoft.git
 
 The command expects to be run inside an existing React Native project, so run steps 1-2 (as per the [docs](https://microsoft.github.io/react-native-windows/docs/next/getting-started)) if starting from scratch.
 
+### Windows
+
 ```sh
 # 1. Create a new React Native project
 npx --yes @react-native-community/cli@next init MyApp --version 0.75
-cd MyAppName
+cd MyApp
 
 # 2. Add the react-native-windows package (preferably matching the minor version of react-native).
 #    This is necessary to add the `init-windows` command to the `react-native` CLI.
@@ -35,7 +37,7 @@ npx react-native autolink-windows
 npx react-native run-windows --arch arm64
 ```
 
-### Frictions with NuGet
+#### Frictions with NuGet
 
 Problem: even if you specify v0.75 explicitly, it seems to give the following warning mentioning v0.76, so maybe NuGet always gets the latest even if npm specified an exact version?
 
@@ -51,6 +53,32 @@ npx react-native init-windows --logging --overwrite --template cpp-app --name My
 ```
 
 
+### macOS
+
+```sh
+# 1. Create a new React Native project
+npx --yes @react-native-community/cli@next init MyApp --version 0.75
+cd MyApp
+
+# 2. Add the react-native-macos package (preferably matching the minor version of react-native).
+#    There is no `init-macos` command in the `react-native` CLI currently, but this may be
+#    necessary to support it in future.
+npm install --save-exact react-native-macos@~0.75
+
+# 3. Initialise a new app in the repo. The name is based on the "name" field of your package.json.
+npx react-native-macos-init
+
+# 4. Autolink the project
+cd macos && pod install && cd ..
+
+# 6. Run the project (by opening macos/MyApp.xcworkspace in Xcode and running the macOS target, or):
+# Terminal 1:
+npx react-native start
+# Terminal 2:
+npx react-native run-macos
+```
+
+
 ## Templates
 
 The source code for the templates lives [here](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates), and the templates are again documented in the `init-windows` [docs](https://microsoft.github.io/react-native-windows/docs/next/init-windows-cli#templates).

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -8,14 +8,9 @@ See the new `init-windows` command in their `@next` [docs](https://microsoft.git
 
 The command expects to be run inside an existing React Native project, so run steps 1-2 (as per the [docs](https://microsoft.github.io/react-native-windows/docs/next/getting-started)) if starting from scratch.
 
-Problem: even if you specify v0.75 explicitly, it seems to give the following warning mentioning v0.76, so maybe NuGet always gets the latest even if npm specified an exact version? So either we need to disable ExperimentalNuget or use 0.76 / canary.
-
-> 1>C:\Users\jbizz\git\MyNewArchApp\windows\MyNewArchAppName\MyNewArchAppName.vcxproj : warning NU1601: Dependency specified was Microsoft.ReactNative (>= 0.75.6-Fabric) but ended up with Microsoft.ReactNative 0.76.0-preview.1.
-> 1>C:\Users\jbizz\git\MyNewArchApp\windows\MyNewArchAppName\MyNewArchAppName.vcxproj : warning NU1601: Dependency specified was Microsoft.ReactNative.Cxx (>= 0.75.6-Fabric) but ended up with Microsoft.ReactNative.Cxx 0.76.0-preview.1.
-
 ```sh
 # 1. Create a new React Native project
-npx --yes @react-native-community/cli@next init MyAppName --version 0.75
+npx --yes @react-native-community/cli@next init MyApp --version 0.75
 cd MyAppName
 
 # 2. Add the react-native-windows package (preferably matching the minor version of react-native).
@@ -24,10 +19,10 @@ npm install --save-exact react-native-windows@~0.75
 
 # 3. Initialise an app or library in the repo.
 # New arch:
-npx react-native init-windows --logging --overwrite --template cpp-app --name MyNewArchAppName --namespace My.New.Arch.App.Namespace
+npx react-native init-windows --logging --overwrite --template cpp-app --name MyNewArchApp --namespace My.New.Arch.App
 npx react-native init-windows --logging --overwrite --template cpp-lib --name MyNewArchLibrary
 # Old arch:
-npx react-native init-windows --logging --overwrite --template old/uwp-cpp-app --name MyOldArchAppName --namespace My.Old.Arch.App.Namespace
+npx react-native init-windows --logging --overwrite --template old/uwp-cpp-app --name MyOldArchApp --namespace My.Old.Arch.App
 npx react-native init-windows --logging --overwrite --template old/uwp-cpp-lib --name MyOldArchLibrary
 
 # 4. Optionally set UseExperimentalNuget to true:
@@ -40,6 +35,22 @@ npx react-native autolink-windows
 npx react-native run-windows --arch arm64
 ```
 
+### Frictions with NuGet
+
+Problem: even if you specify v0.75 explicitly, it seems to give the following warning mentioning v0.76, so maybe NuGet always gets the latest even if npm specified an exact version?
+
+> 1>C:\Users\jbizz\git\MyNewArchApp\windows\MyNewArchAppName\MyNewArchAppName.vcxproj : warning NU1601: Dependency specified was Microsoft.ReactNative (>= 0.75.6-Fabric) but ended up with Microsoft.ReactNative 0.76.0-preview.1.
+> 1>C:\Users\jbizz\git\MyNewArchApp\windows\MyNewArchAppName\MyNewArchAppName.vcxproj : warning NU1601: Dependency specified was Microsoft.ReactNative.Cxx (>= 0.75.6-Fabric) but ended up with Microsoft.ReactNative.Cxx 0.76.0-preview.1.
+
+So I think either we need to disable `ExperimentalNuget` or use 0.76 / canary. I tried using canary, but `react-native` has already moved onto v0.77 while `react-native-windows` is still working on v0.76, so let's try v0.76 instead.
+
+```sh
+npx --yes @react-native-community/cli@next init MyNewArchApp --version 0.76.0-rc.0
+npm install --save-exact [email protected]
+npx react-native init-windows --logging --overwrite --template cpp-app --name MyNewArchApp --namespace My.New.Arch.App
+```
+
+
 ## Templates
 
 The source code for the templates lives [here](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates), and the templates are again documented in the `init-windows` [docs](https://microsoft.github.io/react-native-windows/docs/next/init-windows-cli#templates).

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -8,7 +8,7 @@ See the new `init-windows` command in their `@next` [docs](https://microsoft.git
 
 The command expects to be run inside an existing React Native project, so run steps 1-2 (as per the [docs](https://microsoft.github.io/react-native-windows/docs/next/getting-started)) if starting from scratch.
 
-Problem: even if you specify v0.75 explicitly, it seems to give the following warning mentioning v0.76, so maybe NuGet always gets the latest even if npm specified an exact version? So either we need to disable ExperimentalNuget or use canary.
+Problem: even if you specify v0.75 explicitly, it seems to give the following warning mentioning v0.76, so maybe NuGet always gets the latest even if npm specified an exact version? So either we need to disable ExperimentalNuget or use 0.76 / canary.
 
 > 1>C:\Users\jbizz\git\MyNewArchApp\windows\MyNewArchAppName\MyNewArchAppName.vcxproj : warning NU1601: Dependency specified was Microsoft.ReactNative (>= 0.75.6-Fabric) but ended up with Microsoft.ReactNative 0.76.0-preview.1.
 > 1>C:\Users\jbizz\git\MyNewArchApp\windows\MyNewArchAppName\MyNewArchAppName.vcxproj : warning NU1601: Dependency specified was Microsoft.ReactNative.Cxx (>= 0.75.6-Fabric) but ended up with Microsoft.ReactNative.Cxx 0.76.0-preview.1.

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -8,6 +8,11 @@ See the new `init-windows` command in their `@next` [docs](https://microsoft.git
 
 The command expects to be run inside an existing React Native project, so run steps 1-2 (as per the [docs](https://microsoft.github.io/react-native-windows/docs/next/getting-started)) if starting from scratch.
 
+Problem: even if you specify v0.75 explicitly, it seems to give the following warning mentioning v0.76, so maybe NuGet always gets the latest even if npm specified an exact version? So either we need to disable ExperimentalNuget or use canary.
+
+> 1>C:\Users\jbizz\git\MyNewArchApp\windows\MyNewArchAppName\MyNewArchAppName.vcxproj : warning NU1601: Dependency specified was Microsoft.ReactNative (>= 0.75.6-Fabric) but ended up with Microsoft.ReactNative 0.76.0-preview.1.
+> 1>C:\Users\jbizz\git\MyNewArchApp\windows\MyNewArchAppName\MyNewArchAppName.vcxproj : warning NU1601: Dependency specified was Microsoft.ReactNative.Cxx (>= 0.75.6-Fabric) but ended up with Microsoft.ReactNative.Cxx 0.76.0-preview.1.
+
 ```sh
 # 1. Create a new React Native project
 npx --yes @react-native-community/cli@next init MyAppName --version 0.75

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -15,7 +15,7 @@ cd MyAppName
 
 # 2. Add the react-native-windows package (preferably matching the minor version of react-native).
 #    This is necessary to add the `init-windows` command to the `react-native` CLI.
-npm install --save [email protected]
+npm install --save-exact react-native-windows@~0.75
 
 # 3. Initialise an app or library in the repo.
 # New arch:

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -17,9 +17,13 @@ cd MyAppName
 #    This is necessary to add the `init-windows` command to the `react-native` CLI.
 npm install --save [email protected]
 
-# 3. Initialise an app or library in the repo
-npx react-native init-windows --logging --overwrite --template old/uwp-cpp-app --name MyAppName --namespace My.App.Namespace
-npx react-native init-windows --logging --overwrite --template old/uwp-cpp-lib --name MyLibrary
+# 3. Initialise an app or library in the repo.
+# New arch:
+npx react-native init-windows --logging --overwrite --template cpp-app --name MyNewArchAppName --namespace My.New.Arch.App.Namespace
+npx react-native init-windows --logging --overwrite --template cpp-lib --name MyNewArchLibrary
+# Old arch:
+npx react-native init-windows --logging --overwrite --template old/uwp-cpp-app --name MyOldArchAppName --namespace My.Old.Arch.App.Namespace
+npx react-native init-windows --logging --overwrite --template old/uwp-cpp-lib --name MyOldArchLibrary
 
 # 4. Optionally set UseExperimentalNuget to true:
 #    https://microsoft.github.io/react-native-windows/docs/nuget#c-projects-1

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -10,12 +10,12 @@ The command expects to be run inside an existing React Native project, so run st
 
 ```sh
 # 1. Create a new React Native project
-npx --yes @react-native-community/cli@next init MyAppName --version 0.74
+npx --yes @react-native-community/cli@next init MyAppName --version 0.75
 cd MyAppName
 
 # 2. Add the react-native-windows package (preferably matching the minor version of react-native).
 #    This is necessary to add the `init-windows` command to the `react-native` CLI.
-npm install --save react-native-windows@0.74
+npm install --save react-native-windows@0.75
 
 # 3. Initialise an app or library in the repo
 npx react-native init-windows --logging --overwrite --template old/uwp-cpp-app --name MyAppName --namespace My.App.Namespace

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -36,7 +36,7 @@ npx react-native run-windows --arch arm64
 The source code for the templates lives [here](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates), and the templates are again documented in the `init-windows` [docs](https://microsoft.github.io/react-native-windows/docs/next/init-windows-cli#templates).
 
 - New Architecture:
-  - [cpp-app](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates/cpp-app): C++, Win32, Hermes app, uses Experimental Nuget by default.
+  - [cpp-app](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates/cpp-app): C++, Win32, Hermes app, uses Experimental Nuget by default. More precisely, it seems to be a WAP app with the capability to run a full-trust app (which is presumably the Win32 app). Curiously, the Win32 app isn't set up as an App Service (an extension); the manifest doesn't mention it at all. But there are mentions of UWP in the manifest, so perhaps the WAP app has some UWP aspects to it.
   - [cpp-lib](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates/cpp-lib): C++, Hermes lib (a Turbo Module)
 - Old Architecture:
   - C++: 

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -36,7 +36,7 @@ npx react-native run-windows --arch arm64
 The source code for the templates lives [here](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates), and the templates are again documented in the `init-windows` [docs](https://microsoft.github.io/react-native-windows/docs/next/init-windows-cli#templates).
 
 - New Architecture:
-  - [cpp-app](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates/cpp-app): C++, Win32, Hermes app
+  - [cpp-app](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates/cpp-app): C++, Win32, Hermes app, uses Experimental Nuget by default.
   - [cpp-lib](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates/cpp-lib): C++, Hermes lib (a Turbo Module)
 - Old Architecture:
   - C++: 

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -18,8 +18,8 @@ cd MyAppName
 npm install --save [email protected]
 
 # 3. Initialise an app or library in the repo
-npx react-native@latest init-windows --logging --overwrite --template old/uwp-cpp-app --name MyAppName --namespace My.App.Namespace
-npx react-native@latest init-windows --logging --overwrite --template old/uwp-cpp-lib --name MyLibrary
+npx react-native init-windows --logging --overwrite --template old/uwp-cpp-app --name MyAppName --namespace My.App.Namespace
+npx react-native init-windows --logging --overwrite --template old/uwp-cpp-lib --name MyLibrary
 
 # 4. Optionally set UseExperimentalNuget to true:
 #    https://microsoft.github.io/react-native-windows/docs/nuget#c-projects-1

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -19,6 +19,7 @@ npm install --save [email protected]
 
 # 3. Initialise an app or library in the repo
 npx react-native@latest init-windows --logging --overwrite --template old/uwp-cpp-app --name MyAppName --namespace My.App.Namespace
+npx react-native@latest init-windows --logging --overwrite --template old/uwp-cpp-lib --name MyLibrary
 
 # 4. Optionally set UseExperimentalNuget to true:
 #    https://microsoft.github.io/react-native-windows/docs/nuget#c-projects-1

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -20,11 +20,14 @@ npm install --save [email protected]
 # 3. Initialise an app or library in the repo
 npx react-native@latest init-windows --logging --overwrite --template old/uwp-cpp-app --name MyAppName --namespace My.App.Namespace
 
-# 4. Autolink the project (necessary if running via Visual Studio; but redundant if running via `npx react-native run-windows`)
+# 4. Optionally set UseExperimentalNuget to true:
+#    https://microsoft.github.io/react-native-windows/docs/nuget#c-projects-1
+
+# 5. Autolink the project (necessary if running via Visual Studio; but redundant if running via `npx react-native run-windows`)
 npx react-native autolink-windows
 
-# 5. Run the project
-npx react-native run-windows
+# 6. Run the project (by opening MyAppName/MyAppName.sln in Visual Studio and running for your preferred arch, or):
+npx react-native run-windows --arch arm64
 ```
 
 ## Templates

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -19,6 +19,12 @@ npm install --save [email protected]
 
 # 3. Initialise an app or library in the repo
 npx react-native@latest init-windows --logging --overwrite --template old/uwp-cpp-app --name MyAppName --namespace My.App.Namespace
+
+# 4. Autolink the project (necessary if running via Visual Studio; but redundant if running via `npx react-native run-windows`)
+npx react-native autolink-windows
+
+# 5. Run the project
+npx react-native run-windows
 ```
 
 ## Templates

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -13,7 +13,8 @@ The command expects to be run inside an existing React Native project, so run st
 npx --yes @react-native-community/cli@next init MyAppName --version 0.74
 cd MyAppName
 
-# 2. Add the react-native-windows package (preferably matching the minor version of react-native)
+# 2. Add the react-native-windows package (preferably matching the minor version of react-native).
+#    This is necessary to add the `init-windows` command to the `react-native` CLI.
 npm install --save [email protected]
 
 # 3. Initialise an app or library in the repo

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -10,11 +10,11 @@ The command expects to be run inside an existing React Native project, so run st
 
 ```sh
 # 1. Create a new React Native project
-npx --yes @react-native-community/cli@next init <projectName> --version "nightly"
-cd <projectName>
+npx --yes @react-native-community/cli@next init MyAppName --version 0.74
+cd MyAppName
 
 # 2. Add the react-native-windows package (preferably matching the minor version of react-native)
-npm install --save react-native-windows@latest
+npm install --save react-native-windows@0.74
 
 # 3. Initialise an app or library in the repo
 npx react-native@latest init-windows --logging --overwrite --template old/uwp-cpp-app --name MyAppName --namespace My.App.Namespace

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -1,14 +1,23 @@
 # How to init a project
 
-⚠️ As the original `react-native-windows-init` command is to be [deprecated from [email protected]](https://github.com/microsoft/react-native-windows/issues/13558#issuecomment-2284697890), we should now use `init-windows`, even for generating projects using earlier versions.
+⚠️ As the original [react-native-windows-init](https://microsoft.github.io/react-native-windows/init-cli) command is to be [deprecated from [email protected]](https://github.com/microsoft/react-native-windows/issues/13558#issuecomment-2284697890), we should now use `init-windows`, even for generating projects using earlier versions.
 
 See the new `init-windows` command in their `@next` [docs](https://microsoft.github.io/react-native-windows/docs/next/init-windows-cli).
 
-Usage:
+## Usage
+
+The command expects to be run inside an existing React Native project, so run steps 1-2 (as per the [docs](https://microsoft.github.io/react-native-windows/docs/next/getting-started)) if starting from scratch.
 
 ```sh
-# Run inside an existing React Native project (it will match whatever version of RN you already have):
-npx react-native@latest init-windows --logging --template old/uwp-cpp-app --name MyAppName --namespace My.App.Namespace
+# 1. Create a new React Native project
+npx --yes @react-native-community/cli@next init <projectName> --version "nightly"
+cd <projectName>
+
+# 2. Add the react-native-windows package (preferably matching the minor version of react-native)
+npm install --save react-native-windows@latest
+
+# 3. Initialise an app or library in the repo
+npx react-native@latest init-windows --logging --overwrite --template old/uwp-cpp-app --name MyAppName --namespace My.App.Namespace
 ```
 
 ## Templates

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -7,7 +7,8 @@ See the new `init-windows` command in their `@next` [docs](https://microsoft.git
 Usage:
 
 ```sh
-npx react-native init-windows --logging --template old/uwp-cpp-app --name MyAppName --namespace My.App.Namespace
+# Run inside an existing React Native project (it will match whatever version of RN you already have):
+npx react-native@latest init-windows --logging --template old/uwp-cpp-app --name MyAppName --namespace My.App.Namespace
 ```
 
 ## Templates

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -12,7 +12,7 @@ npx react-native init-windows --logging --template old/uwp-cpp-app --name MyAppN
 
 ## Templates
 
-The templates can be found [here](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates), and are again documented in the `init-windows` [docs](https://microsoft.github.io/react-native-windows/docs/next/init-windows-cli#templates).
+The source code for the templates lives [here](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates), and the templates are again documented in the `init-windows` [docs](https://microsoft.github.io/react-native-windows/docs/next/init-windows-cli#templates).
 
 - New Architecture:
   - [cpp-app](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates/cpp-app): C++, Win32, Hermes app

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -7,7 +7,7 @@ See the new `init-windows` command in their `@next` [docs](https://microsoft.git
 Usage:
 
 ```sh
-npx react-native init-windows --logging --template old/uwp-cpp-app --name MyAppName --namespace My.App.Name
+npx react-native init-windows --logging --template old/uwp-cpp-app --name MyAppName --namespace My.App.Namespace
 ```
 
 ## Templates

diff --git a/React Native Windows handbook.md b/React Native Windows handbook.md
@@ -0,0 +1,33 @@
+# How to init a project
+
+⚠️ As the original `react-native-windows-init` command is to be [deprecated from [email protected]](https://github.com/microsoft/react-native-windows/issues/13558#issuecomment-2284697890), we should now use `init-windows`, even for generating projects using earlier versions.
+
+See the new `init-windows` command in their `@next` [docs](https://microsoft.github.io/react-native-windows/docs/next/init-windows-cli).
+
+Usage:
+
+```sh
+npx react-native init-windows --logging --template old/uwp-cpp-app --name MyAppName --namespace My.App.Name
+```
+
+## Templates
+
+The templates can be found [here](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates), and are again documented in the `init-windows` [docs](https://microsoft.github.io/react-native-windows/docs/next/init-windows-cli#templates).
+
+- New Architecture:
+  - [cpp-app](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates/cpp-app): C++, Win32, Hermes app
+  - [cpp-lib](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates/cpp-lib): C++, Hermes lib (a Turbo Module)
+- Old Architecture:
+  - C++: 
+    - [old/uwp-cpp-app](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates/old/uwp-cpp-app): C++, UWP app
+      - Equivalent to `npx react-native-windows --language cpp --projectType app`.
+    - [old/uwp-cpp-lib](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates/old/uwp-cpp-lib): C++, UWP library
+      - Equivalent to `npx react-native-windows --language cpp --projectType lib`.
+  - C#:
+    - [old/uwp-cs-app](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates/old/uwp-cs-app): C#, UWP app
+      - Equivalent to `npx react-native-windows --language cs --projectType app`.
+    - [old/uwp-cs-lib](https://github.com/microsoft/react-native-windows/tree/main/vnext/templates/old/uwp-cs-lib): C#, UWP library
+      - Equivalent to `npx react-native-windows --language cs --projectType lib`.
+
+A [warning](https://github.com/microsoft/react-native-windows/issues/13558#issuecomment-2284697890) from Jon Thysell:
+> Caution: The new architecture templates available from this command are in no way ready or supported, especially in whatever state they were in in RNW 0.73.