feat(nx): add create-nx-workspace package to simplify workspace creation

This commit is contained in:
Victor Savkin 2019-03-01 18:53:06 -05:00
parent 8d382a8aad
commit 24f31d1495
15 changed files with 180 additions and 110 deletions

View File

@ -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:

View File

@ -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:

View File

@ -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`.

View File

@ -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": {

View File

@ -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",

View File

@ -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 <directory> [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]
}
);

View File

@ -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"
}
}

View File

@ -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",

View File

@ -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 <directory> [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}`);

View File

@ -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": {},

View File

@ -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',

View File

@ -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

View File

@ -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,

View File

@ -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

View File

@ -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