Add templates path to gulpfile.js config

[gmarziou]

Hello,

I am a contributor to JHipster project and I have just started prototyping how to build an Ionic app using JHipster as a backend with Generator-M.

JHipster is a Yeoman generator and generates AngularJS client code in a webapp, this client code is organized by features with a single module. So, it's rather different from the project structure promoted by Generator-M but I think it could be tuned.

I would like to propose PRs that could make Generator-M easier to adapt to this use case.

For example, the templates location is duplicated in watching.js and building.js, I propose to make it configurable in gulpfile.js.

Please tell me what you think.

[gruppjo]

Hi @gmarziou, thanks for your interest and opening this issue!
Sorry you had to wait so long for a reply. I fell sick and it took me a while to recover. Now I'm back :)

I like the idea of making generator-m more configurable. I think it's a lot of work to make the project structure completely configurable, because it also would affect how the subgenerators and the examples are generated. However if you just want to introduce a couple of configuration options like the one described, I'd like that.
What exactly are your project structure requirements?

I'll discuss with my colleagues. @MathiasTim @volkrass, what do you think?

[gmarziou]

No problem, this is a side project on which I work slowly, so I was not blocked.

JHipster's angular code is structured with one single module this way with sub folders per fetaure that contrains ui-router state definitions, controllers and templates.

    webapp
    ├── index.html                        - Application starting page that loads everything
    ├── bower_components         - Dependencies retrieved by bower
    ├── assets
    │   ├── fonts                           - Fonts
    │   ├── images                        - Images
    │   ├── styles                          - CSS stylesheets
    ├── scripts
    │   ├── app                           - App specific components go in here
    │   │   ├── app.js                    - Main script
    │   │   ├── app.constants.js          - Constants generated by build
    │   │   ├── home                           - Home "feature"
    │   │   │   ├── home.js                  - State definition
    │   │   │   ├── home.controller.js    - Component's controller
    │   │   │   ├── home.html             - Component's view
    │   │   │
    │   ├── components                    - Our reusable components, non-specific to our app
    │   │   ├── navbar
    │   │   │   ├── navbar.js
    │   │   │   ├── navbar.controller.js  
    │   │   │   ├── navbar.directive.js
    │   │   │   ├── navbar.html
    │   │   ├── util                      - Generic components like filters to format data

For the Ionic project structure I try stay close while getting closer to yours.
Regarding modules, I mapped JHipster's single module to your 'main' module, I thought to use one module per feature but it may seem too sophisticated.

    app
    ├── index.html                        - Application starting page that loads everything
    ├── app.js                              - Application module that includes other modules (only main at the moment) page that loads everything
    ├── bower_components          - Dependencies retrieved by bower
    ├── main                                 - Main module
    │   ├── assets
    │   │   ├── fonts                         - Fonts
    │   │   ├── images                     - Images
    │   │   ├── styles                        - CSS stylesheets
    │   ├── constants                       - 
    │   ├── components                    - Our reusable components, non-specific to our app
    │   │   ├── navbar
    │   │   │   ├── navbar.js
    │   │   │   ├── navbar.controller.js  
    │   │   │   ├── navbar.directive.js
    │   │   │   ├── navbar.html
    │   │   ├── util                           - Generic components like filters to format data
    │   ├── home                            - Home "feature"
    │   │   ├── home.js                   - State definition
    │   │   ├── home.controller.js    - Component's controller
    │   │   ├── home.html              - Component's view

Some things could be changed to adapt better to Generator-M, however I'd like to keep the organization per feature.

[gmarziou]

To support this structure, I had to configure gulp paths this way:

// config
gulp.paths = {
  dist: 'www',
  templates: ['app/**/*.html', '!app/index.html', '!app/bower_components/**/*.html'],
  jsFiles: ['app/**/*.js', '!app/bower_components/**/*.js'],
  jsonFiles: ['app/**/*.json', '!app/bower_components/**/*.json']
};