feat: add deployment options (close #540, #327)

README.md

@@ -165,6 +165,7 @@ Development, build and quality processes are based on [angular-cli](https://gith
   [Stylelint](http://stylelint.io) and [HTMLHint](http://htmlhint.com/)
 - Local knowledgebase server using [Hads](https://github.com/sinedied/hads)
 - Automatic code formatting with [Prettier](https://prettier.io)
+- Deployment with the CLI using [ng deploy](https://angular.io/guide/deployment)
 
 [Progressive Web App (PWA)](https://developers.google.com/web/progressive-web-apps/) support provided by
 [@angular/service-worker](https://docs.google.com/document/d/1F0e0ROaZUnTFftmC0XovpREHWHjcXa4CggiFlmifjhw/).
@@ -236,6 +237,7 @@ Native mobile application bundling is based on [Cordova](https://cordova.apache.
 - `--strict`: enable all TypeScript strict type checking options.
 - `--skip-quickstart`: disable quick start message after project generation.
 - `--no-prefix`: do not add `@` prefix to `core`/`shared` folders.
+- `--deploy <option>`: choose automatic deployment option. Use `ngx n --deploy` to see possible values.
 
 When generating a *fullstack* project (with both client and server code), you can use the environment variables
 `NGX_CLIENT_PATH` and `NGX_SERVER_PATH` to customize the paths for client and server code. Be aware though that some

generators/app/deployers.js

@@ -0,0 +1,58 @@
+const chalk = require('chalk');
+
+const deployers = [
+  {
+    value: 'none',
+    name: 'No deployment',
+    package: null
+  },
+  {
+    value: 'firebase',
+    name: 'Firebase',
+    package: '@angular/fire'
+  },
+  {
+    value: 'azure',
+    name: 'Azure',
+    package: '@azure/ng-deploy'
+  },
+  {
+    value: 'now',
+    name: 'Now',
+    package: '@zeit/ng-deploy'
+  },
+  {
+    value: 'netlify',
+    name: 'Netlify',
+    package: '@netlify-builder/deploy'
+  },
+  {
+    value: 'github',
+    name: 'GitHub Pages',
+    package: 'angular-cli-ghpages'
+  },
+  {
+    value: 'aws',
+    name: 'Amazon',
+    package: '@jefiozie/ngx-aws-deploy'
+  },
+  {
+    value: 'docker',
+    name: 'Docker',
+    package: 'ngx-deploy-docker'
+  }
+];
+
+const deployerChoices = deployers.map(d => ({
+  value: d.value,
+  name: d.name + (d.value === 'none' ? '' : ` (with ${chalk.green(d.package)})`)
+}));
+const deployerValues = deployers.map(d => d.value);
+const deployerValuesHelp = deployers.map(d => d.value + (d.value === 'none' ? '' : ` (use ${chalk.green(d.package)})`));
+
+module.exports = {
+  deployers,
+  deployerChoices,
+  deployerValues,
+  deployerValuesHelp
+};

generators/app/index.js

@@ -11,6 +11,7 @@ const pkg = require('../../package.json');
 const prompts = require('./prompts');
 const options = require('./options');
 const getLanguages = require('./languages');
+const {deployers} = require('./deployers');
 
 const packageJsonFile = 'package.json';
 const appPath = 'src/app';
@@ -64,6 +65,10 @@ class NgxGenerator extends Generator {
     this.props.initGit = this.options.git;
     this.props.usePrefix = this.options.prefix;
 
+    if (this.options.deploy) {
+      this.props.deploy = this.options.deploy;
+    }
+
     // Updating
     let fromVersion = null;
 
@@ -138,6 +143,7 @@ class NgxGenerator extends Generator {
     this.props.tools = this.props.tools || [];
     this.props.languages = this.props.languages || ['en-US', 'fr-FR'];
     this.props.usePrefix = typeof this.props.usePrefix === 'boolean' ? this.props.usePrefix : true;
+    this.props.deploy = this.props.deploy || 'none';
     this.shareProps(this.props);
   }
 
@@ -212,6 +218,18 @@ class NgxGenerator extends Generator {
   }
 
   end() {
+    const deployer = deployers.find(d => d.value === this.props.deploy);
+
+    if (this.props.deploy !== 'none') {
+      this.log(`\nConfiguring deployment with ${chalk.cyan(deployer.name)}, please wait…\n`);
+      const result = this.spawnCommandSync('ng', ['add', deployer.package]);
+
+      if (result.error) {
+        this.log(`${chalk.red('Something went wrong during deployment configuration :(')}`);
+        this.log(`You can retry manually using ${chalk.yellow(`npx ng add ${deployer.package}`)}`);
+      }
+    }
+
     if (this.updating) {
       this.log(`\nUpdated ${chalk.green(this.props.appName)} to ${chalk.yellow(this.version)} successfully!`);
       return;
@@ -228,6 +246,10 @@ class NgxGenerator extends Generator {
 
     if (this.props.target.includes('web')) {
       this.log(`- $ ${chalk.green(`${this.packageManager} run build`)}: build web app for production`);
+
+      if (this.props.deploy !== 'none') {
+        this.log(`- $ ${chalk.green(`${this.packageManager} run deploy`)}: deploy app to ${deployer.name}`);
+      }
     }
 
     if (this.props.target.includes('cordova')) {

generators/app/options.js

@@ -1,3 +1,5 @@
+const {deployerValues, deployerValuesHelp} = require('./deployers');
+
 module.exports = [
   {
     name: 'skip-welcome',
@@ -69,5 +71,20 @@ module.exports = [
     required: false,
     description: 'Add "@" prefix to core/shared folders',
     defaults: true
+  },
+  {
+    name: 'deploy',
+    required: false,
+    description: 'Choose automatic deployment option',
+    defaults: null,
+    type: value => {
+      if (value !== null && !deployerValues.includes(value)) {
+        console.error(`Invalid deployment option, accepted values:\n- ${deployerValuesHelp.join('\n- ')}`);
+        // eslint-disable-next-line unicorn/no-process-exit
+        process.exit(-1);
+      }
+
+      return value;
+    }
   }
 ];

generators/app/prompts.js

@@ -1,4 +1,5 @@
 const getLanguages = require('./languages');
+const {deployerChoices} = require('./deployers');
 
 module.exports = [
   {
@@ -223,5 +224,13 @@ module.exports = [
         name: 'Date-fns (Moment.js FP alternative)'
       }
     ]
+  },
+  {
+    type: 'list',
+    name: 'deploy',
+    message: 'Which automatic deployment do you want?',
+    default: 'none',
+    choices: deployerChoices,
+    when: props => props.target && props.target.includes('web')
   }
 ];

generators/app/templates/_package.json

@@ -10,6 +10,9 @@
     "ng": "ng",
     "build": "<%= run('env') %> && ng build --prod",
     "start": "<%= run('env') %> && ng serve --proxy-config proxy.conf.js",
+<% if (props.deploy !== 'none') { -%>
+    "deploy": "<%= run('env') %> && ng deploy",
+<% } -%>
 <% if (props.pwa) { -%>
     "serve:sw": "<%= run('build') %> && npx http-server ./<%= props.target.includes('cordova') ? 'www': 'dist' %> -p 4200",
 <% } -%>
@@ -185,7 +188,7 @@
     "stylelint-config-standard": "~20.0.0",
     "stylelint-scss": "~3.16.0",
     "ts-node": "^8.8.1",
-    "tslint": "~6.1.0",
+    "tslint": "~5.20.1",
     "typescript": "~3.8.3"
 <% if (props.tools.includes('prettier')) { -%>
   },