From 24f31d149567045230ac0427f0c751ada4f877bd Mon Sep 17 00:00:00 2001 From: Victor Savkin Date: Fri, 1 Mar 2019 18:53:06 -0500 Subject: [PATCH] feat(nx): add create-nx-workspace package to simplify workspace creation --- README.md | 26 ++---- docs/getting-started/getting-started.md | 26 ++---- docs/tutorial/01-create-application.md | 2 +- package.json | 4 +- packages/builders/package.json | 4 +- .../bin/create-nx-workspace.ts | 92 +++++++++++++++++++ packages/create-nx-workspace/package.json | 31 +++++++ packages/nx/package.json | 2 +- .../schematics/bin/create-nx-workspace.ts | 55 ++--------- packages/schematics/package.json | 4 +- .../src/command-line/nx-commands.ts | 2 +- scripts/build.sh | 6 +- scripts/nx-release.js | 13 ++- scripts/package.sh | 19 +++- scripts/publish.sh | 4 - 15 files changed, 180 insertions(+), 110 deletions(-) create mode 100644 packages/create-nx-workspace/bin/create-nx-workspace.ts create mode 100644 packages/create-nx-workspace/package.json diff --git a/README.md b/README.md index 115a590fd6..1459c78a54 100644 --- a/README.md +++ b/README.md @@ -58,38 +58,26 @@ Nx **is not** a replacement for Angular CLI. **An Nx workspace is an Angular CLI # Getting Started -## Creating an Nx Workspace Using Npx +## Creating an Nx Workspace -Using [Npx](https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b) you can create a new Nx workspace without installing any packages. - -Simply run: +**Using `npx`** ```bash -npx -p @nrwl/schematics create-nx-workspace myworkspace +npx create-nx-workspace myworkspace ``` -## Creating an Nx Workspace Without Npx - -Install `@nrwl/schematics`. +**Using `npm init`** ```bash -npm install -g @nrwl/schematics +npm init nx-workspace myworkspace ``` -Then run: +**Using `yarn create`** ```bash -ng new myworkspace --collection=@nrwl/schematics +yarn create nx-workspace myworkspace ``` -The `ng new` command uses globally-installed packages. Anything installed globally can be in a messy state. If you have any problems running the command above, you can also run: - -```bash -create-nx-workspace myworkspacename -``` - -This command still runs `ng new` under the hood, but it does it in a sandboxed environment, and, as a result, never fails. - ## Adding Nx to an Existing Angular CLI workspace If you already have a regular Angular CLI project, you can add Nx power-ups by running: diff --git a/docs/getting-started/getting-started.md b/docs/getting-started/getting-started.md index b9c3239a83..dc6db37173 100644 --- a/docs/getting-started/getting-started.md +++ b/docs/getting-started/getting-started.md @@ -10,38 +10,24 @@ npm install -g @angular/cli ## Creating an Nx Workspace -### Creating an Nx Workspace Using Npx - -Using [Npx](https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b) you can create a new workspace without installing any packages. - -Simply run: +**Using `npx`** ```bash -npx -p @nrwl/schematics create-nx-workspace myworkspace +npx create-nx-workspace myworkspace ``` -### Creating an Nx Workspace Without Npx - -Install `@nrwl/schematics`. +**Using `npm init`** ```bash -npm install -g @nrwl/schematics +npm init nx-workspace myworkspace ``` -Then run: +**Using `yarn create`** ```bash -ng new myworkspace --collection=@nrw/schematics +yarn create nx-workspace myworkspace ``` -The `ng new` command uses globally-installed packages. Anything installed globally can be in a messy state. If you have any problems running the command above, you can also run: - -```bash -create-nx-workspace myworkspacename -``` - -This command still runs `ng new` under the hood, but it does it in a sandboxed environment, and, as a result, never fails. - ### Adding to an Existing Angular CLI workspace If you already have a regular Angular CLI project, you can add Nx power-ups by running: diff --git a/docs/tutorial/01-create-application.md b/docs/tutorial/01-create-application.md index ae3551a244..a63016508f 100644 --- a/docs/tutorial/01-create-application.md +++ b/docs/tutorial/01-create-application.md @@ -7,7 +7,7 @@ In this tutorial you will use Nx to build a full-stack application out of common **Start by creating a new workspace.** ```bash -npx -p @nrwl/schematics create-nx-workspace myorg +npx create-nx-workspace myorg ``` When asked about 'preset', select `empty`. diff --git a/package.json b/package.json index 19115c9ca2..e04fbee40d 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "@nrwl/nx-source", - "version": "7.6.0", - "description": "Nrwl Extensions for Angular", + "version": "7.6.2", + "description": "Angular CLI power-ups for modern Web development", "main": "index.js", "private": true, "scripts": { diff --git a/packages/builders/package.json b/packages/builders/package.json index 56d7d3fd45..a1c21c9ff5 100644 --- a/packages/builders/package.json +++ b/packages/builders/package.json @@ -1,7 +1,7 @@ { "name": "@nrwl/builders", "version": "0.0.1", - "description": "Nrwl Extensions for Angular: Builders", + "description": "Angular CLI power-ups for modern Web development: Builders", "repository": { "type": "git", "url": "git+https://github.com/nrwl/nx.git" @@ -22,7 +22,7 @@ "bugs": { "url": "https://github.com/nrwl/nx/issues" }, - "homepage": "https://github.com/nrwl/nx#readme", + "homepage": "https://nx.dev", "builders": "./src/builders.json", "dependencies": { "@angular-devkit/architect": "~0.13.1", diff --git a/packages/create-nx-workspace/bin/create-nx-workspace.ts b/packages/create-nx-workspace/bin/create-nx-workspace.ts new file mode 100644 index 0000000000..84095d4938 --- /dev/null +++ b/packages/create-nx-workspace/bin/create-nx-workspace.ts @@ -0,0 +1,92 @@ +#!/usr/bin/env node + +import { execSync } from 'child_process'; +import { dirSync } from 'tmp'; +import { writeFileSync } from 'fs'; +import * as path from 'path'; +import * as yargsParser from 'yargs-parser'; + +const parsedArgs = yargsParser(process.argv, { + string: ['directory'], + boolean: ['help'] +}); + +if (parsedArgs.help) { + console.log(` + Usage: create-nx-workspace [options] [ng new options] + + Create a new Nx workspace + + Options: + + directory path to the workspace root directory + + [ng new options] any 'ng new' options + run 'ng new --help' for more information + `); + process.exit(0); +} + +const nxTool = { + name: 'Schematics', + packageName: '@nrwl/schematics' +}; +let useYarn = true; + +try { + execSync('yarn --version', { stdio: ['ignore', 'ignore', 'ignore'] }); +} catch (e) { + useYarn = false; +} + +const projectName = parsedArgs._[2]; + +// check that the workspace name is passed in +if (!projectName) { + console.error( + 'Please provide a project name (e.g., create-nx-workspace nrwl-proj)' + ); + process.exit(1); +} + +// creating the sandbox +console.log(`Creating a sandbox with Nx...`); +const tmpDir = dirSync().name; + +const nxVersion = 'NX_VERSION'; +const cliVersion = 'ANGULAR_CLI_VERSION'; + +writeFileSync( + path.join(tmpDir, 'package.json'), + JSON.stringify({ + dependencies: { + [nxTool.packageName]: nxVersion, + '@angular/cli': cliVersion + }, + license: 'MIT' + }) +); + +if (useYarn) { + execSync('yarn install --silent', { cwd: tmpDir, stdio: [0, 1, 2] }); +} else { + execSync('npm install --silent', { cwd: tmpDir, stdio: [0, 1, 2] }); +} + +// creating the app itself +const args = process.argv + .slice(2) + .map(a => `"${a}"`) + .join(' '); +console.log(`ng new ${args} --collection=${nxTool.packageName}`); +execSync( + `${path.join( + tmpDir, + 'node_modules', + '.bin', + 'ng' + )} new ${args} --collection=${nxTool.packageName}`, + { + stdio: [0, 1, 2] + } +); diff --git a/packages/create-nx-workspace/package.json b/packages/create-nx-workspace/package.json new file mode 100644 index 0000000000..c11f64cd76 --- /dev/null +++ b/packages/create-nx-workspace/package.json @@ -0,0 +1,31 @@ +{ + "name": "create-nx-workspace", + "version": "0.0.2", + "description": "Angular CLI power-ups for modern Web development", + "repository": { + "type": "git", + "url": "git+https://github.com/nrwl/nx.git" + }, + "keywords": [ + "RxJS", + "Angular", + "Workspace", + "NgRx", + "Schematics", + "Angular CLI" + ], + "bin": { + "create-nx-workspace": "./bin/create-nx-workspace.js" + }, + "author": "Victor Savkin", + "license": "MIT", + "bugs": { + "url": "https://github.com/nrwl/nx/issues" + }, + "homepage": "https://nx.dev", + "dependencies": { + "tmp": "0.0.33", + "yargs-parser": "10.0.0", + "yargs": "^11.0.0" + } +} diff --git a/packages/nx/package.json b/packages/nx/package.json index c53ecd0879..11d10eccc5 100644 --- a/packages/nx/package.json +++ b/packages/nx/package.json @@ -1,7 +1,7 @@ { "name": "@nrwl/nx", "version": "0.0.1", - "description": "Nrwl Extensions for Angular", + "description": "Angular CLI power-ups for modern Web development", "main": "bundles/nrwl-nx.umd.js", "types": "nrwl-nx.d.ts", "module": "esm5/nrwl-nx.js", diff --git a/packages/schematics/bin/create-nx-workspace.ts b/packages/schematics/bin/create-nx-workspace.ts index aa961d1c47..84095d4938 100644 --- a/packages/schematics/bin/create-nx-workspace.ts +++ b/packages/schematics/bin/create-nx-workspace.ts @@ -2,14 +2,10 @@ import { execSync } from 'child_process'; import { dirSync } from 'tmp'; -import { lt } from 'semver'; import { writeFileSync } from 'fs'; import * as path from 'path'; import * as yargsParser from 'yargs-parser'; -import { readJsonFile } from '../src/utils/fileutils'; -import { angularCliVersion } from '../src/lib-versions'; - const parsedArgs = yargsParser(process.argv, { string: ['directory'], boolean: ['help'] @@ -19,29 +15,22 @@ if (parsedArgs.help) { console.log(` Usage: create-nx-workspace [options] [ng new options] - Create a new Nx workspace (that is to say a new angular-cli project using @nrwl/schematics) + Create a new Nx workspace Options: directory path to the workspace root directory - --yarn use yarn (default to false) - --bazel use bazel instead of webpack (default to false) [ng new options] any 'ng new' options run 'ng new --help' for more information `); process.exit(0); } -const schematicsTool = { + +const nxTool = { name: 'Schematics', packageName: '@nrwl/schematics' }; -const bazelTool = { - name: 'Bazel', - packageName: '@nrwl/bazel' -}; - -const nxTool = parsedArgs.bazel ? bazelTool : schematicsTool; let useYarn = true; try { @@ -50,36 +39,8 @@ try { useYarn = false; } -if (!useYarn) { - try { - // check the correct version of the NPM is installed - const output = execSync('npm --version').toString(); - if (lt(output, '5.0.0')) { - console.error( - 'To create a workspace you must have NPM >= 5.0.0 installed.' - ); - process.exit(1); - } - } catch (e) { - console.error( - 'Cannot find npm. If you want to use yarn to create a project, pass the --yarn flag.' - ); - process.exit(1); - } -} - const projectName = parsedArgs._[2]; -if (parsedArgs.bazel) { - if (!/^\w+$/.test(projectName)) { - console.error( - `${projectName} is invalid for a bazel workspace.\n` + - 'Your workspace name must contain only alphanumeric characters and underscores.' - ); - process.exit(1); - } -} - // check that the workspace name is passed in if (!projectName) { console.error( @@ -89,15 +50,12 @@ if (!projectName) { } // creating the sandbox -console.log(`Creating a sandbox with the CLI and Nx ${nxTool.name}...`); +console.log(`Creating a sandbox with Nx...`); const tmpDir = dirSync().name; -// we haven't updated bazel to CLI6 yet -const nxVersion = parsedArgs.bazel - ? '1.0.3' - : readJsonFile(path.join(path.dirname(__dirname), 'package.json')).version; +const nxVersion = 'NX_VERSION'; +const cliVersion = 'ANGULAR_CLI_VERSION'; -const cliVersion = parsedArgs.bazel ? '1.7.2' : angularCliVersion; writeFileSync( path.join(tmpDir, 'package.json'), JSON.stringify({ @@ -118,7 +76,6 @@ if (useYarn) { // creating the app itself const args = process.argv .slice(2) - .filter(a => a !== '--yarn' && a !== '--bazel') .map(a => `"${a}"`) .join(' '); console.log(`ng new ${args} --collection=${nxTool.packageName}`); diff --git a/packages/schematics/package.json b/packages/schematics/package.json index 6a4258a26d..511b04cd09 100644 --- a/packages/schematics/package.json +++ b/packages/schematics/package.json @@ -1,7 +1,7 @@ { "name": "@nrwl/schematics", "version": "0.0.2", - "description": "Nrwl Extensions for Angular: Schematics", + "description": "Angular CLI power-ups for modern Web development: Schematics", "repository": { "type": "git", "url": "git+https://github.com/nrwl/nx.git" @@ -25,7 +25,7 @@ "bugs": { "url": "https://github.com/nrwl/nx/issues" }, - "homepage": "https://github.com/nrwl/nx#readme", + "homepage": "https://nx.dev", "schematics": "./src/collection.json", "ng-update": { "requirements": {}, diff --git a/packages/schematics/src/command-line/nx-commands.ts b/packages/schematics/src/command-line/nx-commands.ts index 49e540728a..557799ae0d 100644 --- a/packages/schematics/src/command-line/nx-commands.ts +++ b/packages/schematics/src/command-line/nx-commands.ts @@ -18,7 +18,7 @@ const noop = (yargs: yargs.Argv): yargs.Argv => yargs; * be executed correctly. */ export const commandsObject = yargs - .usage('Nrwl Extensions for Angular') + .usage('Angular CLI power-ups for modern Web development') .command( 'affected', 'Run task for affected projects', diff --git a/scripts/build.sh b/scripts/build.sh index c80533a4ae..e4255349ea 100755 --- a/scripts/build.sh +++ b/scripts/build.sh @@ -26,6 +26,7 @@ rm -rf build/packages/nx/bundles/nrwl-nx-testing.umd.min.js.bak rsync -a --exclude=*.ts packages/ build/packages chmod +x build/packages/schematics/bin/create-nx-workspace.js +chmod +x build/packages/create-nx-workspace/bin/create-nx-workspace.js chmod +x build/packages/schematics/src/command-line/nx.js rm -rf build/packages/install rm -rf build/packages/nx/dist @@ -33,10 +34,11 @@ rm -rf build/packages/nx/spec cp README.md build/packages/builders cp README.md build/packages/schematics cp README.md build/packages/nx -cp LICENSE build/packages/bazel +cp README.md build/packages/create-nx-workspace cp LICENSE build/packages/builders cp LICENSE build/packages/schematics cp LICENSE build/packages/nx +cp LICENSE build/packages/create-nx-workspace echo "Nx libraries available at build/packages:" -ls build/packages \ No newline at end of file +ls build/packages diff --git a/scripts/nx-release.js b/scripts/nx-release.js index cb0b6befd8..736c46dc34 100755 --- a/scripts/nx-release.js +++ b/scripts/nx-release.js @@ -2,6 +2,8 @@ const yargsParser = require('yargs-parser'); const releaseIt = require('release-it'); const childProcess = require('child_process'); +const fs = require('fs'); +const path = require('path'); const parsedArgs = yargsParser(process.argv, { boolean: ['dry-run', 'nobazel'], @@ -88,10 +90,14 @@ if (!parsedVersion.isValid) { console.log('parsed version: ', JSON.stringify(parsedVersion)); } +const cliVersion = JSON.parse( + fs.readFileSync(path.join(__dirname, '../package.json')) +).devDependencies['@angular/cli']; + console.log('Executing build script:'); -const buildCommand = `./scripts/package.sh ${parsedVersion.version} ${ +const buildCommand = `./scripts/package.sh ${ parsedVersion.version -}`; +} ${cliVersion}`; console.log(`> ${buildCommand}`); childProcess.execSync(buildCommand, { stdio: [0, 1, 2] @@ -140,7 +146,8 @@ const options = { 'build/npm/bazel/package.json', 'build/npm/builders/package.json', 'build/npm/nx/package.json', - 'build/npm/schematics/package.json' + 'build/npm/schematics/package.json', + 'build/npm/create-nx-workspace/package.json' ], increment: parsedVersion.version, requireUpstream: false, diff --git a/scripts/package.sh b/scripts/package.sh index 20ea87625d..6b6a758a8e 100755 --- a/scripts/package.sh +++ b/scripts/package.sh @@ -3,8 +3,8 @@ # This shell script is executed by nx-release.js # ################################################## -SCHEMATICS_VERSION=$1 -NX_VERSION=$2 +NX_VERSION=$1 +ANGULAR_CLI_VERSION=$2 ./scripts/build.sh @@ -12,12 +12,23 @@ cd build/packages if [[ "$OSTYPE" == "darwin"* ]]; then sed -i "" "s|exports.nxVersion = '\*';|exports.nxVersion = '$NX_VERSION';|g" schematics/src/lib-versions.js - sed -i "" "s|exports.schematicsVersion = '\*';|exports.schematicsVersion = '$SCHEMATICS_VERSION';|g" schematics/src/lib-versions.js + sed -i "" "s|exports.schematicsVersion = '\*';|exports.schematicsVersion = '$NX_VERSION';|g" schematics/src/lib-versions.js + sed -i "" "s|\*|$NX_VERSION|g" create-nx-workspace/package.json + sed -i "" "s|NX_VERSION|$NX_VERSION|g" create-nx-workspace/bin/create-nx-workspace.js + sed -i "" "s|ANGULAR_CLI_VERSION|$ANGULAR_CLI_VERSION|g" create-nx-workspace/bin/create-nx-workspace.js + sed -i "" "s|NX_VERSION|$NX_VERSION|g" schematics/bin/create-nx-workspace.js + sed -i "" "s|ANGULAR_CLI_VERSION|$ANGULAR_CLI_VERSION|g" schematics/bin/create-nx-workspace.js else sed -i "s|exports.nxVersion = '\*';|exports.nxVersion = '$NX_VERSION';|g" schematics/src/lib-versions.js - sed -i "s|exports.schematicsVersion = '\*';|exports.schematicsVersion = '$SCHEMATICS_VERSION';|g" schematics/src/lib-versions.js + sed -i "s|exports.schematicsVersion = '\*';|exports.schematicsVersion = '$NX_VERSION';|g" schematics/src/lib-versions.js + sed -i "s|\*|$NX_VERSION|g" create-nx-workspace/package.json + sed -i "s|NX_VERSION|$NX_VERSION|g" create-nx-workspace/bin/create-nx-workspace.js + sed -i "s|ANGULAR_CLI_VERSION|$ANGULAR_CLI_VERSION|g" create-nx-workspace/bin/create-nx-workspace.js + sed -i "s|NX_VERSION|$NX_VERSION|g" schematics/bin/create-nx-workspace.js + sed -i "s|ANGULAR_CLI_VERSION|$ANGULAR_CLI_VERSION|g" schematics/bin/create-nx-workspace.js fi tar -czf nx.tgz nx tar -czf schematics.tgz schematics +tar -czf create-nx-workspace.tgz create-nx-workspace diff --git a/scripts/publish.sh b/scripts/publish.sh index 4c1a890f4f..c24f7b8fa3 100755 --- a/scripts/publish.sh +++ b/scripts/publish.sh @@ -9,9 +9,6 @@ PACKAGE_SOURCE=build/packages NPM_DEST=build/npm ORIG_DIRECTORY=`pwd` -# Get rid of tarballs at top of copied directory (made with npm pack) -find $NPM_DEST -maxdepth 1 -name *.tgz -delete - # We are running inside of a child_process, so we need to reauth npm adduser @@ -24,7 +21,6 @@ do PACKAGE_NAME=`node -e "console.log(require('./package.json').name)"` echo "Publishing ${PACKAGE_NAME}@${VERSION} --tag ${TAG}" - npm publish --tag $TAG --access public cd $ORIG_DIRECTORY done