Integrating angular cli project with groovy gradle app

Question

I'm trying to integrate the seed project of angular-cli with my java app that is packaged by Gradle and deployed in tomcat server.

How to integrate the angular build with Gradle build? And where is best to put the compiled scss files for my project. I'm thinking of having them under assets and the compiled css files will be generated under assests as well.

Here is my folders structure:

myApp
├── gradle
├── src
│   └── main
│       ├── groovy
│       ├── resources
│       ├── webapp
│       └── ngapp
             ├── angular-cli.json
             ├── e2e
             ├── karma.conf.js
             ├── node_modules
             ├── package.json
             ├── protractor.conf.js
             ├── tslint.json
             ├── tsconfig.json
             ├── WEB-INF
             ├── src
                 ├── app //app component and other features components here
                 ├── assets
                 ├── environments
                 ├── typings.d.ts
                 ├── index.html
                 ├── main.ts
                 ├── polyfills.ts
                 ├── styles.css
                 └── tsconfig.app.json

.angular-cli.json

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "project": {
    "name": "ngapp"
  },
  "apps": [
    {
      "root": "src",
      "outDir": "../webapp/ng",
      "assets": [
        "assets"
      ],
      "index": "index.html",
      "main": "main.ts",
      "polyfills": "polyfills.ts",
      "tsconfig": "tsconfig.json",
      "styles": [
        "styles.css"
      ],
      "scripts": [],
      "environmentSource": "environments/environment.ts",
      "environments": {
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts"
      }
    }
  ],
  "e2e": {
    "protractor": {
      "config": "./protractor.conf.js"
    }
  },
  "lint": [
    {
      "project": "src/main/ngapp/tsconfig.json"
    }
  ],
  "defaults": {
    "styleExt": "css",
    "component": {}
  }
}

tsconfig.json:

  {
      "compileOnSave": false,
      "compilerOptions": {
        "outDir": "./dist/out-tsc",
        "baseUrl": "src/main/ngapp",
        "sourceMap": true,
        "declaration": false,
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "target": "es5",
        "typeRoots": [
          "node_modules/@types"
        ],
        "lib": [
          "es2016",
          "dom"
        ]
      }
}

Valery Lyatsevich Valery Lyatsevich · Accepted Answer · 2017-07-04T12:24:29

Perhaps issue with

 "lint": [{
  "project": "src/main/ngapp/tsconfig.json"
}]

Usually it looks like that

"lint": [{
  "project": "src/tsconfig.json"
}]

Integrating angular cli project with groovy gradle app

1 Answers