Skip to content

developing.md

Latest commit

 

History

History
87 lines (59 loc) · 3.34 KB

developing.md

File metadata and controls

87 lines (59 loc) · 3.34 KB

Extending/Developing

Prerequisites

  • Java [1].
  • Git (only if you are going to clone the project).

[1] Node/Npm or Node/Yarn can be used.

Getting it

Clone or download the project[1], in the desired folder execute:

git clone https://github.com/gmullerb/mutable-webpack-angular-builder

[1] Cloning a repository

Set up

  • No need, only download and run (It's Gradle! Yes!).

Gradle will allow to have different really isolate Node/Npm environments for different projects, but npm or yarn can be used.

Folders structure

  /src
    /main
    /test
      /mocks
  • src/main: Main source files.
  • src/test: Test source files[1].
  • src/test/mocks: Module mocks.

[1] Tests are done with Karma and Jasmine.

Building it

Gradle

  • To assess files:

    • gradlew assessCommon: will check common style of files.
    • gradlew assessGradle: will check code style of build.gradle file.
    • gradlew assessStyleMain: will check eslint style of main source files.
    • gradlew assessTypingMain: will check Flow typings of main source files.
    • gradlew assessStyleTest: will check eslint style of test source files.

  • To test code and check coverage: gradlew unitTest

  • To "build" it:

    • gradlew: this will run default tasks:
      • assessCommon, assessGradle, npmInstall, build
        • build: will also execute assess tasks and test tasks.

  • To get all the tasks for the project: gradlew tasks --all

Recommendation: First time run gradlew to start from a "ok" code.

Node

  • "main-flow": will check Flow typings of main source files.
  • "onlyGradle:main-lint": will check eslint style of main source files [1].
  • "onlyGradle:test-lint": will check eslint style of test source files [1].
  • "test": will run test and coverage for the project.

There are some scripts that "only" can be run from gradle (prefixed with onlyGradle:), because gradle will download some files that are required by those tasks and set the respective npm config variables. To use it from node this must be done manually.
[1] it will use eslint configuration defined in base-style-config.

Customizing Facts

  • mutable-webpack-angular-builder extends @angular-devkit/build-angular BrowserBuilder class.
  • schema.json basically define only defaults from the original @angular-devkit/build-angular
    • In the way the schema.json's validation is implemented, "does not allow" to extend json (it use only http), issues/11307.
  • Angular Ng uses CommonJs for this, then use:
    • Object.defineProperty(exports, '__esModule', { value: true })
    • exports.MutableWebpackBrowserBuilder = MutableWebpackBrowserBuilder
    • exports.default = MutableWebpackBrowserBuilder
  • Project uses Flow to add some extra validation (less invasive than Typescript).
  • Checks this Good guide for creating Angular's builders: Angular CLI 6 under the hood — builders demystified.

Main documentation

Back