From 51fc89443ba85d14172c4f5a71296c0c8f963ee9 Mon Sep 17 00:00:00 2001 From: Eric Rozell Date: Tue, 2 Aug 2016 13:54:41 -0400 Subject: [PATCH 1/3] fix(RNPM): fix rnpm-plugin-windows to work with react-native-cli/rnpm/windows/index RNPM has recently moved to react-native, and there have been a few changes to the core behavior. Making sure our plugin is compatible. --- local-cli/rnpm/windows/index.js | 8 ++++---- local-cli/rnpm/windows/package.json | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/local-cli/rnpm/windows/index.js b/local-cli/rnpm/windows/index.js index 69889026ed3..5dd3c73b545 100644 --- a/local-cli/rnpm/windows/index.js +++ b/local-cli/rnpm/windows/index.js @@ -1,12 +1,12 @@ -module.exports = [{ +module.exports = { func: require('./src/windows'), description: 'Generate React Native Windows template project', name: 'windows [name]', options: [{ - flags: '--windowsVersion ', + command: '--windowsVersion [version]', description: 'The version of react-native-windows to use.' }, { - flags: '--namespace ', + command: '--namespace [namespace]', description: 'The native project namespace.' }] -}]; +}; diff --git a/local-cli/rnpm/windows/package.json b/local-cli/rnpm/windows/package.json index f502295e5ba..d1e8e9af29b 100644 --- a/local-cli/rnpm/windows/package.json +++ b/local-cli/rnpm/windows/package.json @@ -1,6 +1,6 @@ { "name": "rnpm-plugin-windows", - "version": "0.1.1", + "version": "0.2.0-rc.0", "description": "rnpm plugin that generates a Windows template project", "main": "index.js", "scripts": { From 71fa35b9998379b4f713bbe89537de0b469ba6c0 Mon Sep 17 00:00:00 2001 From: Eric Rozell Date: Tue, 2 Aug 2016 17:20:12 -0400 Subject: [PATCH 2/3] fix(CLI): changes to work with react-native-cli extensions. RNPM has been merged into react-native and is now the primary architecture for the react-native CLI. As such, we finally have support for things like `react-native windows` and `react-native run-windows`. These changes update the declarative syntax for RNPM plugins to match what is required for integration with react-native-cli. --- README.md | 9 ++++---- local-cli/generator-windows/index.js | 3 +-- .../templates/src/project.json | 4 ++-- local-cli/rnpm/windows/README.md | 22 +++++++++++++------ local-cli/runWindows/runWindows.js | 17 +++++++------- local-cli/runWindows/utils/deploy.js | 3 +-- 6 files changed, 31 insertions(+), 27 deletions(-) diff --git a/README.md b/README.md index da413e51b3e..47d627a8063 100644 --- a/README.md +++ b/README.md @@ -28,10 +28,9 @@ See the official [React Native website](https://facebook.github.io/react-native/ ## Getting Started - Follow the [Getting Started guide](http://facebook.github.io/react-native/docs/getting-started.html) to install React Native and its dependencies. -- Change your working directory to the project directory you specified in the `react native init` command from the [Getting Started guide](http://facebook.github.io/react-native/docs/getting-started.html) (i.e., `cd AwesomeProject`). -- Install [rnpm](https://github.com/rnpm/rnpm) via NPM, globally (i.e., `npm install -g rnpm`). +- Change your working directory to the project directory you specified in the `react-native init` command from the [Getting Started guide](http://facebook.github.io/react-native/docs/getting-started.html) (e.g., `cd AwesomeProject`). - Install [rnpm-plugin-windows](https://www.npmjs.com/package/rnpm-plugin-windows) from NPM (i.e., `npm install --save-dev rnpm-plugin-windows`). -- Initialize Windows project with `rnpm windows` command in the project directory. +- Initialize Windows project with `react-native windows` command in the project directory. - Learn more about various [tools for debugging React Native](http://facebook.github.io/react-native/docs/debugging.html). ### Requirements @@ -84,12 +83,12 @@ The GitHub issues are intended for bug reports and feature requests. For help an ## FAQs -1. Running `rnpm windows` fails with `No compatible version found: react-native-windows@0.x.*` +1. Running `react-native windows` fails with `No compatible version found: react-native-windows@0.x.*` We try to keep up-to-date with the latest version of `react-native`, but sometimes we fall a bit behind. The default behavior of the Windows init RNPM plugin is to try and install the version of `react-native-windows` that matches the version of `react-native` that you're using (from the `package.json` file of your project). Often times, an older version of `react-native-windows` will work just fine with a later version of `react-native`, so a good first attempt is to try and select the latest (or release candidate) version of `react-native-windows` using the `--windowsVersion` flag. E.g., ``` -rnpm windows --windowsVersion 0.x.0-rc.0 +react-native windows --windowsVersion 0.x.0-rc.0 ``` Where `x` is the version of `react-native` you have installed. diff --git a/local-cli/generator-windows/index.js b/local-cli/generator-windows/index.js index f4e49500f0b..b094893b2d7 100644 --- a/local-cli/generator-windows/index.js +++ b/local-cli/generator-windows/index.js @@ -109,7 +109,6 @@ module.exports = yeoman.Base.extend({ end: function() { const projectPath = path.resolve(this.destinationRoot(), 'windows', this.name); this.log(chalk.white.bold('To run your app on UWP:')); - this.log(chalk.white(` Open ${projectPath}.sln in Visual Studio`)); - this.log(chalk.white(' Deploy the application and run on the specified destination')); + this.log(chalk.white(' react-native run-windows')); } }); diff --git a/local-cli/generator-windows/templates/src/project.json b/local-cli/generator-windows/templates/src/project.json index d4f71221132..d56a6f906ac 100644 --- a/local-cli/generator-windows/templates/src/project.json +++ b/local-cli/generator-windows/templates/src/project.json @@ -1,7 +1,7 @@ { "dependencies": { - "Facebook.CSSLayout": "2.0.0-pre", - "Microsoft.NETCore.UniversalWindowsPlatform": "5.0.0" + "Facebook.CSSLayout": "2.0.1-pre", + "Microsoft.NETCore.UniversalWindowsPlatform": "5.2.2" }, "frameworks": { "uap10.0": {} diff --git a/local-cli/rnpm/windows/README.md b/local-cli/rnpm/windows/README.md index eeb81488a42..ef3ccfbc07d 100644 --- a/local-cli/rnpm/windows/README.md +++ b/local-cli/rnpm/windows/README.md @@ -4,17 +4,17 @@ To bootstrap the creation of Windows projects for React Native, we've published ## Project Initialization -To start, make sure you have RNPM installed globally. +To start, make sure you have the react-native CLI installed globally. ``` -npm install -g rnpm +npm install -g react-native-cli ``` -Once RNPM is installed, install the Windows plugin for RNPM and initialize your project. +Once the CLI is installed, install rnpm-plugin-windows and initialize your project. ``` npm install --save-dev rnpm-plugin-windows -rnpm windows +react-native windows ``` The `windows` command will do the following: @@ -25,16 +25,24 @@ The `windows` command will do the following: ### Usage ``` -rnpm windows [name] [--namespace ] [--windowsVersion ] +react-native windows [name] [--namespace ] [--windowsVersion ] ``` -The RNPM `windows` command takes an optional command line argument. +The `windows` command takes an optional command line argument. - `name` - The name of the project, which will be used for both file names and the name of the component that is registered in the React Native [AppRegistry](https://facebook.github.io/react-native/docs/appregistry.html). Default value is the name given in the root-level `package.json`. -The RNPM `windows` command accepts two optional flags. +The `windows` command accepts two optional flags. - `--namepace` - The namespace that will be used in the generated native C# code. Default value is `name`. - `--windowsVersion` - The version of `react-native-windows` that will be used. Default value is matches the major and minor version of `react-native` if installed, otherwise the latest version. +### React Native 0.27.* -> 0.30.* + +For versions of react-native prior to 0.31.0, you'll need to use the [rnpm](http://github.com/rnpm/rnpm) global CLI to run the `windows` command. Since the RNPM plugin syntax for the react-native CLI is not backward compatibile with rnpm, you'll need to use an older version of `rnpm-plugin-windows`: + +``` +npm install --save-dev rnpm-plugin-windows@0.1.* +``` + ## Running React Windows Applications Coming soon. diff --git a/local-cli/runWindows/runWindows.js b/local-cli/runWindows/runWindows.js index c6194fc23b6..4fdcb962d0f 100644 --- a/local-cli/runWindows/runWindows.js +++ b/local-cli/runWindows/runWindows.js @@ -27,10 +27,9 @@ function runWindows(config, args, options) { // Get build/deploy options const buildType = options.release ? 'Release' : 'Debug'; - const buildArch = options.arch ? options.arch : 'x86'; try { - build.buildSolution(slnFile, buildType, buildArch); + build.buildSolution(slnFile, buildType, options.arch); } catch (e) { console.error(chalk.red(`Build failed with message ${e}. Check your build configuration.`)); return; @@ -76,26 +75,26 @@ module.exports = { description: 'builds your app and starts it on a connected Windows desktop, emulator or device', func: runWindows, options: [{ - flags: '--release', + command: '--release', description: 'Specifies a release build', }, { - flags: '--root [string]', + command: '--root [string]', description: 'Override the root directory for the windows build which contains the windows folder.', }, { - flags: '--arch [string]', + command: '--arch [string]', description: 'The build architecture (ARM, x86, x64)', default: 'x86', }, { - flags: '--emulator', + command: '--emulator', description: 'Deploys the app to an emulator', }, { - flags: '--device', + command: '--device', description: 'Deploys the app to a connected device', }, { - flags: '--target [string]', + command: '--target [string]', description: 'Deploys the app to the specified GUID for a device.', }, { - flags: '--proxy', + command: '--proxy', description: 'Deploys the app in remote debugging mode.', }] }; diff --git a/local-cli/runWindows/utils/deploy.js b/local-cli/runWindows/utils/deploy.js index 383a4ec4e9c..7bedfbf546d 100644 --- a/local-cli/runWindows/utils/deploy.js +++ b/local-cli/runWindows/utils/deploy.js @@ -12,8 +12,7 @@ const WinAppDeployTool = require('./winappdeploytool'); function getAppPackage(options) { const configuration = options.release ? 'Release' : 'Debug'; - const arch = options.arch ? options.arch : 'x86'; - return glob.sync(path.join(options.root, `windows/*/AppPackages/*_${arch}_${configuration}_*`))[0]; + return glob.sync(path.join(options.root, `windows/*/AppPackages/*_${options.arch}_${configuration}_*`))[0]; } function getWindowsStoreAppUtils(options) { From 9ff14679982d1db870eb2990285e5b8f833e86ec Mon Sep 17 00:00:00 2001 From: Eric Rozell Date: Fri, 5 Aug 2016 10:17:42 -0400 Subject: [PATCH 3/3] fix(NPM): Sets RNPM plugin version to 0.2.0 and updates dependencies This version of the RNPM plugin is only expected to work with react-native 0.31.0 and later, earlier versions of react-native (and react-native-windows) should be used in conjunction with the rnpm global CLI. --- local-cli/rnpm/windows/package.json | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/local-cli/rnpm/windows/package.json b/local-cli/rnpm/windows/package.json index d1e8e9af29b..89082a5dba6 100644 --- a/local-cli/rnpm/windows/package.json +++ b/local-cli/rnpm/windows/package.json @@ -1,6 +1,6 @@ { "name": "rnpm-plugin-windows", - "version": "0.2.0-rc.0", + "version": "0.2.0", "description": "rnpm plugin that generates a Windows template project", "main": "index.js", "scripts": { @@ -20,6 +20,9 @@ "node": ">= 4.0.0" }, "license": "MIT", + "peerDependencies": { + "react-native": ">=0.31.0" + }, "dependencies": { "semver": "^5.0.3", "chalk": "^1.1.3"