Feat: ng add support

README.md

@@ -2,6 +2,12 @@
 
 > [Angular](https://angular.io/) + [DataTables](https://datatables.net/)
 
+# Usage
+
+```
+ng add angular-datatables
+```
+
 # Documentation
 
 Please check the [online documentation](http://l-lin.github.io/angular-datatables/)

package.json

@@ -4,10 +4,11 @@
   "description": "Angular directive for DataTables",
   "scripts": {
     "build": "npm run clean && npm run compile && npm run bundles",
-    "clean": "rimraf -f index.{d.ts,js,js.map,metadata.json} src/*.{d.ts,js,map,metadata.json} bundles",
+    "clean": "rimraf -f index.{d.ts,js,js.map,metadata.json} src/*.{d.ts,js,map,metadata.json} bundles schematics/**/*.{d.ts,js,map}",
     "compile": "npm run lint:code && ngc -p tsconfig-build.json",
     "compile:tsc": "npm run lint && tsc -p tsconfig.json",
     "bundles": "npm run rollup && npm run rollup:min",
+    "schematics:build": "tsc -p schematics/tsconfig.json",
     "lint": "npm run lint:code && npm run lint:test",
     "lint:code": "tslint ./src/**/*.ts -t verbose --exclude ./src/**/*.d.ts",
     "lint:test": "tslint ./test/**/*.ts -t verbose --exclude ./test/**/*.d.ts",
@@ -23,6 +24,7 @@
     "Michael Bennett <[email protected]>",
     "Steven Masala <[email protected]>"
   ],
+  "schematics": "./schematics/src/collection.json",
   "main": "bundles/angular-datatables.umd.js",
   "module": "index.js",
   "typings": "index.d.ts",
@@ -38,6 +40,8 @@
     "jquery": ">=3.4.1"
   },
   "devDependencies": {
+    "@angular-devkit/core": "^9.0.5",
+    "@angular-devkit/schematics": "^9.0.5",
     "@angular/common": "^8.0.0",
     "@angular/compiler": "^8.0.0",
     "@angular/compiler-cli": "^8.0.0",
@@ -66,6 +70,7 @@
     "rollup": "~1.15.0",
     "rollup-plugin-uglify": "~6.0.2",
     "rxjs": "^6.5.2",
+    "schematics-utilities": "^2.0.1",
     "tslint": "~5.17.0",
     "typescript": "~3.4.5",
     "zone.js": "~0.9.1"

schematics/.editorconfig

@@ -0,0 +1,4 @@
+[*]
+charset = utf-8
+indent_size = 2
+indent_style = space

schematics/.gitignore

@@ -0,0 +1,19 @@
+# Outputs
+src/**/*.js
+src/**/*.js.map
+src/**/*.d.ts
+dist/
+
+# IDEs
+.idea/
+jsconfig.json
+.vscode/
+
+# Misc
+node_modules/
+npm-debug.log*
+yarn-error.log*
+
+# Mac OSX Finder files.
+**/.DS_Store
+.DS_Store

schematics/.npmignore

@@ -0,0 +1,3 @@
+# Ignores TypeScript files, but keeps definitions.
+*.ts
+!*.d.ts

schematics/src/collection.json

@@ -0,0 +1,11 @@
+{
+  "$schema": "../../node_modules/@angular-devkit/schematics/collection-schema.json",
+  "schematics": {
+    "ng-add": {
+      "description": "Adds Angular Datatables to the application without affecting any templates",
+      "factory": "./ng-add/index",
+      "schema": "./ng-add/schema.json",
+      "aliases": ["install"]
+    }
+  }
+}

schematics/src/ng-add/index.ts

@@ -0,0 +1,101 @@
+import { Rule, SchematicContext, Tree, chain } from '@angular-devkit/schematics';
+import {
+  addPackageJsonDependency, NodeDependency, NodeDependencyType, getWorkspace,
+  getProjectFromWorkspace, addModuleImportToRootModule
+} from 'schematics-utilities';
+import { NodePackageInstallTask } from '@angular-devkit/schematics/tasks';
+
+export default function (_options: any): Rule {
+  return chain([
+    addPackageJsonDependencies(),
+    installPackageJsonDependencies(),
+    updateAngularJsonFile(),
+    addModuleToAppModule()
+  ]);
+}
+
+function addPackageJsonDependencies() {
+  return (tree: Tree, context: SchematicContext) => {
+    // Update package.json
+    const dependencies: NodeDependency[] = [
+      { type: NodeDependencyType.Default, version: '3.4.1', name: 'jquery' },
+      { type: NodeDependencyType.Default, version: '1.1.0', name: 'datatables.net' },
+      { type: NodeDependencyType.Default, version: '1.1.0', name: 'datatables.net-dt' },
+      { type: NodeDependencyType.Default, version: '1.1.0', name: 'angular-datatables' },
+      { type: NodeDependencyType.Dev, version: '1.1.0', name: '@types/jquery' },
+      { type: NodeDependencyType.Dev, version: '1.1.0', name: '@types/datatables.net' }
+    ];
+
+    dependencies.forEach(dependency => {
+
+      addPackageJsonDependency(tree, dependency);
+      context.logger.log('info', `✅️ Added "${dependency.name}" into ${dependency.type}`);
+    });
+    return tree
+  }
+}
+
+function installPackageJsonDependencies(): Rule {
+  return (host: Tree, context: SchematicContext) => {
+    context.addTask(new NodePackageInstallTask());
+    context.logger.log('info', `🔍 Installing packages...`);
+
+    return host;
+  };
+}
+
+
+function updateAngularJsonFile() {
+  return (tree: Tree, context: SchematicContext) => {
+    try {
+      const angularJsonFile = tree.read('angular.json');
+
+      if (angularJsonFile) {
+        const angularJsonFileObject = JSON.parse(angularJsonFile.toString('utf-8'));
+        const project = Object.keys(angularJsonFileObject['projects'])[0];
+        const projectObject = angularJsonFileObject.projects[project];
+
+        const styles = projectObject.targets.build.options.styles;
+        const scripts = projectObject.targets.build.options.scripts;
+
+        styles.push({
+          input: "node_modules/datatables.net-dt/css/jquery.dataTables.css"
+        });
+
+        scripts.push({
+          input: "node_modules/jquery/dist/jquery.js"
+        });
+
+        scripts.push({
+          input: "node_modules/datatables.net/js/jquery.dataTables.js"
+        });
+
+        tree.overwrite('angular.json', JSON.stringify(angularJsonFileObject, null, 2));
+        context.logger.log('info', `✅️ Updated angular.json`);
+      } else {
+        context.logger.log('error', '🚫 Failed to locate angular.json.')
+      }
+    } catch (e) {
+      context.logger.log('error', `🚫 Failed to update angular.json.`);
+    }
+
+  }
+}
+
+function addModuleToAppModule(): Rule {
+  return (host: Tree, context: SchematicContext) => {
+    const moduleName = 'DataTablesModule';
+    try {
+      const workspace = getWorkspace(host);
+      const project = getProjectFromWorkspace(
+        workspace,
+        Object.keys(workspace['projects'])[0]
+      );
+      addModuleImportToRootModule(host, moduleName, 'angular-datatables', project);
+    } catch (e) {
+      context.logger.log('error', `🚫 Failed to update app.module.ts`);
+      return host;
+    }
+    context.logger.log('info', `✅️ "${moduleName}" is imported`);
+  }
+}

schematics/src/ng-add/schema.json

@@ -0,0 +1,16 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "id": "angular-datatables-schematic-angular-datatables",
+  "title": "Angular DataTables angular-datatables schematic",
+  "type": "object",
+  "properties": {
+    "project": {
+      "title": "angular-datatables",
+      "type": "string",
+      "description": "The name of the project.",
+      "$default": {
+        "$source": "projectName"
+      }
+    }
+  }
+}

schematics/tsconfig.json

@@ -0,0 +1,34 @@
+{
+  "compilerOptions": {
+    "baseUrl": "tsconfig",
+    "lib": [
+      "es2018",
+      "dom"
+    ],
+    "declaration": true,
+    "module": "commonjs",
+    "moduleResolution": "node",
+    "noEmitOnError": true,
+    "noFallthroughCasesInSwitch": true,
+    "noImplicitAny": true,
+    "noImplicitThis": true,
+    "noUnusedParameters": true,
+    "noUnusedLocals": true,
+    "rootDir": "src/",
+    "skipDefaultLibCheck": true,
+    "skipLibCheck": true,
+    "sourceMap": true,
+    "strictNullChecks": true,
+    "target": "es6",
+    "types": [
+      "jasmine",
+      "node"
+    ]
+  },
+  "include": [
+    "src/**/*"
+  ],
+  "exclude": [
+    "src/*/files/**/*"
+  ]
+}