fountainjs/generator-fountain-webapp

Yeoman 'fountain' generator to start a webapp

generator-fountain-webapp's Issues

Problem using this generator

~/desarrollo/fountain$ yo fountain-webapp

/usr/lib/node_modules/generator-fountain-webapp/generators/app/index.js:9
    this.composeWith(`fountain-${this.props.framework}`, { options: this.props
                     ^

Any ideas?

Support for Angular 2 Static Template Compilation

Hello,

? Which JavaScript framework do you want? Angular 2
? Which module management do you want? Webpack with NPM
? Which CSS preprocessor do you want? SASS
? Which JS preprocessor do you want? TypeScript

I've modified the hello.ts to extract the html and I've created hello.html file, like this:

@Component({
  selector: 'hello-app',
  templateUrl: './app/hello.html'
})

So my new application structure is:

| src
|- app
|-- -- hello.html
|-- -- hello.spec.ts
|-- -- hello.ts
|-- index.ts
|-- index.html
|-- etc ..

No problem when I use gulp serve but when I try to generate a new distribution with gulp serve:dist the sub asset was not included in the dist folder.

Uncaught (in promise) Failed to load app/hello.html

Do you have a workaround for this problem ?

Thanks in advance.

Remove ESLint env mocha in each generator

Since we use AVA we can remove (or replace) the env mocha in ESLint config

https://github.com/FountainJS/generator-fountain-webapp/blob/master/package.json#L66

https://github.com/FountainJS/generator-fountain-webpack/blob/master/package.json#L56

etc...

AssertionError: Trying to copy from a source that does not exist:

Hello,

using the latest version

`(17:17:11):~/dev/tests/my-new-project$ yo fountain-webapp
? Which JavaScript framework do you want? React
? Which module management do you want? Webpack with NPM
? Which CSS preprocessor do you want? SASS
? Which JS preprocessor do you want? TypeScript
? Do you want a sample app? A working landing page

events.js:154
throw er; // Unhandled 'error' event
^
AssertionError: Trying to copy from a source that does not exist: /Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/generator-fountain-react/generators/techs/templates/src/index.tsx
at EditionInterface.exports._copySingle (/Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/mem-fs-editor/actions/copy.js:45:3)
at EditionInterface.exports.copy (/Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/mem-fs-editor/actions/copy.js:23:17)
at EditionInterface.module.exports as copyTpl
at copyTemplate (/Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/fountain-generator/lib/file-utils.js:50:11)
at /Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/generator-fountain-react/generators/techs/index.js:30:12
at Array.map (native)
at writing (/Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/generator-fountain-react/generators/techs/index.js:29:11)
at /Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/yeoman-generator/lib/base.js:430:16
at processImmediate as _immediateCallback
(17:34:40):~/dev/tests/my-new-project$`

Contributing to Docs?

Hi. I Ike the fountains.io docs a lot, but I've found a bug (it says "wepack", and I'm 99% sure it should be "webpack". I could just change this myself and submit a pull request, but are is the documentation an open source project as well?

HTML watch stuck on "Reloading Browsers..."

Description - Problem

Off a fresh generation of angular1 with gulp, typescript, sass, and systemJS I noticed changes to HTML files were not triggering a browserSync refresh every time. When I looked into it further, it would trigger a refresh the first time I made any changes to HTML files, but any subsequent changes would not trigger a refresh. To view those changes I had to ctrl + c and npm start serve.

Solution

I found this broswerSync issue that looked similar to my problem and tried the proposed solution there. I solved my problem by making changes to the watch function in gulpfile.js.

Before

function watch(done) {
  gulp.watch(conf.path.src('**/*.html'), browserSync.reload);
  gulp.watch([
    conf.path.src('**/*.scss'),
    conf.path.src('**/*.css')
  ], gulp.series('styles'));
  gulp.watch(conf.path.src('**/*.ts'), gulp.series('scripts'));
  done();
}

After

function watch(done) {
  gulp.watch(conf.path.src('**/*.html'), function(done) {
    browserSync.reload();
    done();
  });
  gulp.watch([
    conf.path.src('**/*.scss'),
    conf.path.src('**/*.css')
  ], gulp.series('styles'));
  gulp.watch(conf.path.src('**/*.ts'), gulp.series('scripts'));
  done();
}

Let me know if I'm not seeing any consequences of this change. I tested changes to .scss and .ts files after and they still refreshed the browser normally.

Error Message & Stack Trace

After editing an HTML file more than once:

[15:13:58] Starting '<anonymous>'...
[BS] Reloading Browsers...

Config

{
  "generator-fountain-angular1": {
    "version": "0.5.3",
    "props": {
      "framework": "angular1",
      "modules": "systemjs",
      "js": "typescript",
      "css": "scss",
      "resolved": "/usr/local/lib/node_modules/generator-fountain-webapp/node_modules/generator-fountain-angular1/generators/app/index.js",
      "namespace": "fountain-angular1",
      "argv": {
        "remain": [],
        "cooked": [],
        "original": []
      },
      "skip-cache": false,
      "skip-install": false,
      "sample": "todoMVC"
    }
  }
}

Environment

Node.js v5.9.0
darwin 15.4.0
yo --version 1.8.4
npm --version 3.7.3

Tests failing when TypeScript target is set to "es6" (Angular 1 & 2)

Description

npm run test fails when TypeScript target is set to "es6".

• Create a project with Angular 1 and TypeScript
• Add "target": "es6" to "compilerOptions" in /conf/ts.conf
• Run npm run test

For Angular 2: the tests run, although a lot of errors are shown.

Error Message & Stack Trace (Angular 1)

[03:37:00] Loading C:\Temp\tst-angular1-ts\gulp_tasks\browsersync.js
[03:37:00] Loading C:\Temp\tst-angular1-ts\gulp_tasks\karma.js
[03:37:01] Loading C:\Temp\tst-angular1-ts\gulp_tasks\misc.js
[03:37:01] Loading C:\Temp\tst-angular1-ts\gulp_tasks\partials.js
[03:37:01] Loading C:\Temp\tst-angular1-ts\gulp_tasks\webpack.js
[03:37:01] Using gulpfile C:\Temp\tst-angular1-ts\gulpfile.js
[03:37:01] Starting 'test'...
[03:37:01] Starting 'karma:single-run'...
ts-loader: Using [email protected] and C:\Temp\tst-angular1-ts\tsconfig.json
27 06 2016 03:37:05.030:INFO [karma]: Karma v0.13.22 server started at http://localhost:9876/
27 06 2016 03:37:05.030:INFO [launcher]: Starting browser PhantomJS
27 06 2016 03:37:06.459:INFO [PhantomJS 2.1.1 (Windows 8 0.0.0)]: Connected on socket /#RlcLfswuA0JP0fgCAAAA with id 230
02180
PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR
  SyntaxError: Unexpected token 'const'
  at C:/Temp/tst-angular1-ts/src/index.spec.js:102


PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at C:/Temp/tst-angular1-ts/src/app/footer.html.js:1


PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at C:/Temp/tst-angular1-ts/src/app/header.html.js:1


PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at C:/Temp/tst-angular1-ts/src/app/main.html.js:1


PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at C:/Temp/tst-angular1-ts/src/app/techs/tech.html.js:1


PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at C:/Temp/tst-angular1-ts/src/app/techs/techs.html.js:1


PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at C:/Temp/tst-angular1-ts/src/app/title.html.js:1


PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at C:/Temp/tst-angular1-ts/src/index.html.js:1


[03:37:06] 'karma:single-run' errored after 4.7 s
[03:37:06] Error: Failed 1 tests.
    at C:\Temp\tst-angular1-ts\gulp_tasks\karma.js:11:22
    at removeAllListeners (C:\Temp\tst-angular1-ts\node_modules\karma\lib\server.js:336:7)
    at Server.<anonymous> (C:\Temp\tst-angular1-ts\node_modules\karma\lib\server.js:347:9)
    at Server.g (events.js:273:16)
    at emitNone (events.js:85:20)
    at Server.emit (events.js:179:7)
    at emitCloseNT (net.js:1529:8)
    at _combinedTickCallback (node.js:380:13)
    at process._tickDomainCallback (node.js:431:11)
[03:37:06] 'test' errored after 4.73 s

Error Message & Stack Trace (Angular 2)

[03:39:21] Loading C:\Temp\tst-angular2-ts\gulp_tasks\browsersync.js
[03:39:21] Loading C:\Temp\tst-angular2-ts\gulp_tasks\karma.js
[03:39:22] Loading C:\Temp\tst-angular2-ts\gulp_tasks\misc.js
[03:39:22] Loading C:\Temp\tst-angular2-ts\gulp_tasks\webpack.js
[03:39:22] Using gulpfile C:\Temp\tst-angular2-ts\gulpfile.js
[03:39:22] Starting 'test'...
[03:39:22] Starting 'karma:single-run'...
ts-loader: Using [email protected] and C:\Temp\tst-angular2-ts\conf\ts.conf.json
Hash: 6be75ed3fb8e1609af55
Version: webpack 2.1.0-beta.8
Time: 7300ms
            Asset     Size  Chunks             Chunk Names
src/index.spec.js  8.01 MB       0  [emitted]  src/index.spec.js
chunk    {0} src/index.spec.js (src/index.spec.js) 2.93 MB [rendered]
    [0] ./~/rxjs/Observable.js 6.03 kB {0} [built]
(... lines removed ...)
  [793] ./src/index.spec.js 128 bytes {0} [built]
  [794] util (ignored) 15 bytes {0}

ERROR in ./src/app/techs/techs.spec.ts
(5,43): error TS2307: Cannot find module '@angular/http/testing'.

ERROR in ./src/app/techs/techs.spec.ts
(6,67): error TS2307: Cannot find module '@angular/http'.

ERROR in ./src/app/techs/techs.spec.ts
(7,41): error TS2307: Cannot find module '@angular/core'.

ERROR in ./src/app/techs/techs.spec.ts
(10,72): error TS2307: Cannot find module '@angular/core/testing'.

ERROR in ./src/app/techs/techs.spec.ts
(11,54): error TS2307: Cannot find module '@angular/compiler/testing'.

ERROR in ./src/app/techs/techs.spec.ts
(13,26): error TS2307: Cannot find module 'rxjs/Rx'.

ERROR in ./src/app/techs/tech.spec.ts
(6,51): error TS2307: Cannot find module '@angular/core/testing'.

ERROR in ./src/app/techs/tech.spec.ts
(7,54): error TS2307: Cannot find module '@angular/compiler/testing'.

ERROR in ./src/app/title.spec.ts
(6,51): error TS2307: Cannot find module '@angular/core/testing'.

ERROR in ./src/app/title.spec.ts
(7,54): error TS2307: Cannot find module '@angular/compiler/testing'.

ERROR in ./src/app/techs/tech.ts
(1,32): error TS2307: Cannot find module '@angular/core'.

ERROR in ./src/app/title.ts
(1,25): error TS2307: Cannot find module '@angular/core'.

ERROR in ./src/app/techs/techs.ts
(1,25): error TS2307: Cannot find module '@angular/core'.

ERROR in ./src/app/techs/techs.ts
(2,36): error TS2307: Cannot find module '@angular/http'.

ERROR in ./src/app/techs/techs.ts
(3,26): error TS2307: Cannot find module 'rxjs/Observable'.

ERROR in ./src/app/main.ts
(1,25): error TS2307: Cannot find module '@angular/core'.

ERROR in ./src/app/main.spec.ts
(5,25): error TS2307: Cannot find module '@angular/core'.

ERROR in ./src/app/main.spec.ts
(11,73): error TS2307: Cannot find module '@angular/core/testing'.

ERROR in ./src/app/main.spec.ts
(12,54): error TS2307: Cannot find module '@angular/compiler/testing'.

ERROR in ./src/app/main.spec.ts
(13,89): error TS2307: Cannot find module '@angular/platform-browser/testing'.

ERROR in ./src/app/main.spec.ts
(14,45): error TS2307: Cannot find module '@angular/platform-browser-dynamic'.

ERROR in ./src/app/header.ts
(1,25): error TS2307: Cannot find module '@angular/core'.

ERROR in ./src/app/header.spec.ts
(6,51): error TS2307: Cannot find module '@angular/core/testing'.

ERROR in ./src/app/header.spec.ts
(7,54): error TS2307: Cannot find module '@angular/compiler/testing'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(3,14): error TS2300: Duplicate identifier 'PropertyKey'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(6,5): error TS2300: Duplicate identifier 'done'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(7,5): error TS2300: Duplicate identifier 'value'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(245,5): error TS2300: Duplicate identifier 'EPSILON'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(280,5): error TS2300: Duplicate identifier 'MAX_SAFE_INTEGER'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(287,5): error TS2300: Duplicate identifier 'MIN_SAFE_INTEGER'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(343,5): error TS2300: Duplicate identifier 'flags'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(495,5): error TS2300: Duplicate identifier 'prototype'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(558,5): error TS2300: Duplicate identifier 'size'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(567,5): error TS2300: Duplicate identifier 'prototype'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(578,5): error TS2300: Duplicate identifier 'size'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(587,5): error TS2300: Duplicate identifier 'prototype'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(602,5): error TS2300: Duplicate identifier 'prototype'.

ERROR in C:\Temp\tst-angular2-ts\typings\globals\es6-shim\index.d.ts
(616,5): error TS2300: Duplicate identifier 'prototype'.

ERROR in ./src/app/footer.spec.ts
(7,51): error TS2307: Cannot find module '@angular/core/testing'.

ERROR in ./src/app/footer.spec.ts
(8,54): error TS2307: Cannot find module '@angular/compiler/testing'.

ERROR in ./src/app/footer.ts
(1,25): error TS2307: Cannot find module '@angular/core'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(17,14): error TS2300: Duplicate identifier 'PropertyKey'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(237,5): error TS2300: Duplicate identifier 'EPSILON'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(272,5): error TS2300: Duplicate identifier 'MAX_SAFE_INTEGER'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(279,5): error TS2300: Duplicate identifier 'MIN_SAFE_INTEGER'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(565,5): error TS2300: Duplicate identifier 'done'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(566,5): error TS2300: Duplicate identifier 'value'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(795,5): error TS2300: Duplicate identifier 'flags'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(823,5): error TS2300: Duplicate identifier 'size'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(833,5): error TS2300: Duplicate identifier 'prototype'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(849,5): error TS2300: Duplicate identifier 'prototype'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(861,5): error TS2300: Duplicate identifier 'size'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(871,5): error TS2300: Duplicate identifier 'prototype'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(886,5): error TS2300: Duplicate identifier 'prototype'.

ERROR in C:\Temp\tst-angular2-ts\node_modules\typescript\lib\lib.es6.d.ts
(1282,5): error TS2300: Duplicate identifier 'prototype'.
27 06 2016 03:39:34.739:INFO [karma]: Karma v0.13.22 server started at http://localhost:9876/
27 06 2016 03:39:34.755:INFO [launcher]: Starting browser Chrome
27 06 2016 03:39:36.373:INFO [Chrome 51.0.2704 (Windows 8.1 0.0.0)]: Connected on socket /#NXHH5GeDfSMopsQkAAAA with id
44621177
Chrome 51.0.2704 (Windows 8.1 0.0.0): Executed 7 of 7 SUCCESS (0.254 secs / 0.248 secs)
[03:39:37] Finished 'karma:single-run' after 14 s
[03:39:37] Finished 'test' after 15 s

Config (Angular 1)

Content from .yo-rc.json for Angular 1:

{
  "generator-fountain-angular1": {
    "version": "0.5.4",
    "props": {
      "framework": "angular1",
      "modules": "webpack",
      "js": "typescript",
      "css": "scss",
      "resolved": "C:\\Users\\user\\AppData\\Roaming\\npm\\node_modules\\generator-fountain-webapp\\node_modules\\generator-fountain-angular1\\generators\\app\\index.js",
      "namespace": "fountain-angular1",
      "argv": {
        "remain": [],
        "cooked": [],
        "original": []
      },
      "skip-cache": false,
      "skip-install": false,
      "sample": "techs",
      "router": "none"
    }
  }
}

Config (Angular 2)

Content from .yo-rc.json for Angular 2:

{
  "generator-fountain-angular2": {
    "version": "0.5.4",
    "props": {
      "framework": "angular2",
      "modules": "webpack",
      "js": "typescript",
      "css": "scss",
      "resolved": "C:\\Users\\user\\AppData\\Roaming\\npm\\node_modules\\generator-fountain-webapp\\node_modules\\generator-fountain-angular2\\generators\\app\\index.js",
      "namespace": "fountain-angular2",
      "argv": {
        "remain": [],
        "cooked": [],
        "original": []
      },
      "skip-cache": false,
      "skip-install": false,
      "sample": "techs",
      "router": "none"
    }
  }
}

Environment

Tell us which operating system you are using, as well as which versions of Node.js, npm, and yo.

Node.js v5.9.1
win32 6.3.9600
yo 1.8.4
npm 3.8.0

AssertionError: Trying to copy from a source that does not exist:

Using the latest version

(17:17:11):~/dev/tests/my-new-project$ yo fountain-webapp
? Which JavaScript framework do you want? React
? Which module management do you want? Webpack with NPM
? Which CSS preprocessor do you want? SASS
? Which JS preprocessor do you want? TypeScript
? Do you want a sample app? A working landing page

events.js:154
      throw er; // Unhandled 'error' event
      ^
AssertionError: Trying to copy from a source that does not exist: /Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/generator-fountain-react/generators/techs/templates/src/index.tsx
    at EditionInterface.exports._copySingle (/Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/mem-fs-editor/actions/copy.js:45:3)
    at EditionInterface.exports.copy (/Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/mem-fs-editor/actions/copy.js:23:17)
    at EditionInterface.module.exports [as copyTpl] (/Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/mem-fs-editor/actions/copy-tpl.js:12:8)
    at copyTemplate (/Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/fountain-generator/lib/file-utils.js:50:11)
    at /Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/generator-fountain-react/generators/techs/index.js:30:12
    at Array.map (native)
    at writing (/Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/generator-fountain-react/generators/techs/index.js:29:11)
    at /Users/sebas/.nvm/versions/node/v5.5.0/lib/node_modules/generator-fountain-webapp/node_modules/yeoman-generator/lib/base.js:430:16
    at processImmediate [as _immediateCallback] (timers.js:383:17)
(17:34:40):~/dev/tests/my-new-project$
(17:34:40):~/dev/tests/my-new-project$ npm list  -g  generator-fountain-webapp
/Users/sebas/.nvm/versions/node/v5.5.0/lib
└── [email protected]

bootstrap?

Sorry, maybe due to my lack of understanding of webpack - but how do I include bootstrap CSS/SASS into my project, and ng2-bootstrap as well ?

Handle project updates

Description

How do you handle fountain project updates ? For example, let's say I've created 20 projects using fountain. Then, a bug is fixed in a gulpfile or build file, template etc - how do I roll that bugfix out to all 20 projects ?

Do I have to manually upgrade each one ?

npm WARN deprecated [email protected]

npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue

Proper Method to inject module into Angular 1 project using NPM

Description

This is more a 'help' question than anything, but should probably get documented once answered.

In gulp-angular, to add a module I would install it through bower, and add it to the module line, and ngInject would take it from there.

angular.module('ng1m', [ 'ui.router', 'ngMaterial',...

It looks like in the new fountain-webapp, I need to:

1. Run npm install angular-material --save
2. Add an import statement to index.module.js - import 'angular-material';
3. Add it to my .module - angular.module('app', ['ui.router', 'ngMaterial',...
4. And maybe something else...?

Using this process I can find my JavaScript files under sources in Chrome Dev Tools - webpack://./~/angular-material/angular-material.js?ec27

The CSS appears to be injected at the top of the DOM, right after head

My HTML template: <md-button> Flat Button </md-button>
Renders into: <button class="md-button md-ink-ripple" type="button" ng-transclude="" aria-label="Flat Button"><span class="ng-scope"> Flat Button </span></button>

But .md-button and .md-ink-ripple have no classes applied.

Happy to provide more detail, but didn't know if I was missing something obvious here.

Error Message & Stack Trace

No errors.

Config

{
  "generator-fountain-angular1": {
    "version": "0.5.4",
    "props": {
      "framework": "angular1",
      "modules": "webpack",
      "js": "babel",
      "css": "scss",
      "resolved": "C:\\Users\\...\\AppData\\Roaming\\npm\\node_modules\\generator-fountain-webapp\\node_modules\\generator-fountain-angular1\\generators\\app\\index.js",
      "namespace": "fountain-angular1",
      "argv": {
        "remain": [],
        "cooked": [],
        "original": []
      },
      "skip-cache": false,
      "skip-install": false,
      "sample": "todoMVC",
      "router": "uirouter"
    }
  }
}

Environment

node -e "var os=require('os');console.log('Node.js ' + process.version + '\n' + os.platform() + ' ' + os.release())"
Node.js v4.4.6
win32 6.1.7601

yo --version
1.8.4

npm --version
3.10.2

Add fountain favicon in generated projects

Support Jade/PugJS

Is this planned, didn't find any information regarding this.
Coming from the old generator, this feature would be missed.

Dist broken with System / TodoMVC

There is a problem with the system builder trying to compile todomvc css.

Can't make project with SystemJS (Angular 1 or Angular 2) to work

I followed all the instructions and when i try to create a project with systemjs it doesnt work.

First the installation throw this error:

I had to uninstall jspm and reinstall it to make it work. Then i run npm install and jspm install. And when i run gulp serve it throws this error:

Webpacks projects runs just fine, but i can't manage to make a project with system/jspm to work.

Thanks in advance.

Cannot select sample app type

When I get to the part in the prompt when it asks "Do you want a sample app?" I cannot select the hello world option. The arrow keys down work on that prompt. I used Angular 2, Webpack with NPM, SASS, and Typescript.

Routing.

I'm not familiar with the structure and design of this generator as it's very different from regular Angular 1 projects. I'm wondering how routing is handled here. I haven't found any documentation for that around and the Angular 2 styleguide wasn't much help.

Lock down dependency versions

Hello,

I think it would be much better and safer to lock down all dependency versions to even the minor ones. Right now, using ^ in package.json (which means "any recent major version") makes it very difficult to track problems between different envs and even here when one would like to report an issue. Especially for stuff like babel-, systemjs-, jspm, angular 2, and so on, which recently and constantly break with its "beta" versions every few days or so. What do you think?

HTML watcher only works once

First off - great work on the generator!

I have been running into an issue where the html change watcher only works once. E.g. I run 'gulp serve', make a change to an html file and the first time the browser refreshes successfully, but when I change the same html file again, the change is not detected. I can change a different html file which also triggers a browser refresh once. If I change a .ts file, the change is always detected. I have run the generator a few times and the issue is always reproducible.

Following is my setup and the configuration options I have used:

OS: OSX 10.11.5
Node version: 4.2.4
NPM version: 3.9.5

Framework: Angular 1
Modules manager: Webpack with NPM
CSS preprocessor: SASS
JS preprocessor: TypeScript
Sample app: Techs

Any help would be much appreciated!

Clean up generators dependencies

While we can use this issue tracker as task manager because there is no one else :)

While splitting the generators, I tried to isolate each tech inside its generator to be able to replace it or not use it one day. (That's not just for fun, Karma could perfectly be replaced by Jest one day for example, Browsersync by an express server comming from another generator...)

But I already spotted some misses in that design. And I fear that there is more. Correcting them is not easy as it involves some inter-generator code. I start by listing them here:

• karma reference in gulpfile.js for defining test task
• browsersync reference in styles.js gulp file.

Throws "this.env.adapter.promt(...).then is not a function" Error When Run

I install the generator with _npm install -g fountain_ and then run _yo fountain-webapp_

But this error appears:

TypeError: this.env.adapter.prompt(...).then is not a function at Base.prompt (/usr/local/lib/node_modules/generator-fountain-webapp/node_modules/yeoman-generator/lib/base.js:232:45) at fountainPrompting (/usr/local/lib/node_modules/generator-fountain-webapp/node_modules/fountain-generator/lib/Base.js:77:17) at prompting (/usr/local/lib/node_modules/generator-fountain-webapp/generators/app/index.js:15:17) at Object.<anonymous> (/usr/local/lib/node_modules/generator-fountain-webapp/node_modules/yeoman-generator/lib/base.js:431:23) at /usr/local/lib/node_modules/generator-fountain-webapp/node_modules/run-async/index.js:26:25 at /usr/local/lib/node_modules/generator-fountain-webapp/node_modules/run-async/index.js:25:19 at /usr/local/lib/node_modules/generator-fountain-webapp/node_modules/yeoman-generator/lib/base.js:432:9 at tryOnImmediate (timers.js:543:15) at processImmediate [as _immedi

WebStorm resolve issue

Webstorm cannot resolve angular2/core in the hello.ts file with typescript and systemjs.

build: SystemJS and build static

Regarding the recent code change in gulp_tasks/systemjs.js:

1. When using const Builder = require('jspm').Builder

serve works with Chrome (but not FF), and serve:dist fails with "Uncaught Module 1 not present." in a browser console.

2. When using const Builder = require('systemjs-builder');

serve same as above, and serve:dist fails during build:

[15:34:55] Finished 'styles' after 2.41 s
[15:34:55] 'systemjs' errored after 2.9 s
[15:34:55] TypeError: No resolution found at all for condition github:jspm/[email protected]/#:./process.js.
    at [project-path]/node_modules/systemjs-builder/lib/trace.js:683:15
    at Array.forEach (native)
    at [project-path]/node_modules/systemjs-builder/lib/trace.js:676:6
    at bound (domain.js:287:14)
    at runBound (domain.js:300:12)
    at tryCatcher ([project-path]/node_modules/bluebird/js/release/util.js:16:23)
    at Promise._settlePromiseFromHandler ([project-path]/node_modules/bluebird/js/release/promise.js:502:31)
    at Promise._settlePromise ([project-path]/node_modules/bluebird/js/release/promise.js:559:18)
    at Promise._settlePromise0 ([project-path]/node_modules/bluebird/js/release/promise.js:604:10)
    at Promise._settlePromises ([project-path]/node_modules/bluebird/js/release/promise.js:683:18)
    at Async._drainQueue ([project-path]/node_modules/bluebird/js/release/async.js:138:16)
    at Async._drainQueues ([project-path]/node_modules/bluebird/js/release/async.js:148:10)
    at Immediate.Async.drainQueues [as _onImmediate] ([project-path]/node_modules/bluebird/js/release/async.js:17:14)
    at tryOnImmediate (timers.js:534:15)
    at processImmediate [as _immediateCallback] (timers.js:514:5)

versions: jspm 0.17.0-beta.13, systemjs-builder 0.15.15, systemjs 0.19.26

Gulp serve error

$ gulp serve
[13:01:14] Loading gulp_tasks\browsersync.js
[13:01:14] Loading gulp_tasks\build.js
[13:01:16] Loading gulp_tasks\inject.js
[13:01:17] Loading gulp_tasks\karma.js
[13:01:18] Loading gulp_tasks\misc.js
[13:01:18] Loading gulp_tasks\partials.js
[13:01:18] Loading gulp_tasks\scripts.js
[13:01:19] Loading gulp_tasks\styles.js
[13:01:19] Using gulpfile ~\{PROJECT DIRECTORY}\gulpfile.js
C:\Users\roverbot\AppData\Roaming\npm\node_modules\gulp\bin\gulp.js:129
    gulpInst.start.apply(gulpInst, toRun);
                  ^

TypeError: Cannot read property 'apply' of undefined
    at C:\Users\roverbot\AppData\Roaming\npm\node_modules\gulp\bin\gulp.js:129:19
    at nextTickCallbackWith0Args (node.js:419:9)
    at process._tickCallback (node.js:348:13)
    at Function.Module.runMain (module.js:444:11)
    at startup (node.js:136:18)
    at node.js:966:3

Fountain JS ToDo

The steps I'll list here can exceed the perimeter of this generator but I have to put this somewhere. The granularity and the order of the steps can (and will) evolve over time. Don't hesitate to argue or add something.

• Makes things works with NPM
• Readme fountain-webapp
• Contributing fountain-webapp
• Design fountain-webapp
• Optimization task for Webpack
• Optimization task for SystemJS
• Optimization task for Inject
• Handling styles with Webpack
• Handling styles for inject and SystemJS
• Support for TypeScript and plain JS
• Support for CSS, SASS and LESS
• Script the release process
• Initiate tests
• Initiate sample app
• Wire up Travis

Later / Macro...

• Move generator-gulp-angular repo inside FountainJS
• Create a home website with doc & blog, a bit like yeoman.io to be honest
• Create a Electron multiplatform app to run the generator

Blog post to write in parallel. To be published on the website when online.

• Why (still) Gulp
• Fountain generators approach
• Web Dev Experience

Testing generator with angular1: problem with

$ node --version
v4.2.6

$ npm install -g yo gulp-cli
$ npm install -g generator-fountain-webapp
$ yo fountain-webapp
❯ Angular 1 
❯ Webpack with NPM 
❯ SASS 
❯ TypeScript 

$ gulp serve

[12:41:17] Loading /home/rsk/desarrollo/fountain/gulp_tasks/partials.js
module.js:328
    throw err;
    ^
Error: Cannot find module 'gulp-minify-html'

Then, I try with

npm install -d gulp-minify-html

But now, when run "gulp serve", I get this:

[12:44:17] Using gulpfile ~/desarrollo/fountain/gulpfile.js
/usr/local/lib/node_modules/gulp/bin/gulp.js:129
    gulpInst.start.apply(gulpInst, toRun);
                  ^
TypeError: Cannot read property 'apply' of undefined

Bug or I'm doing something wrong? (thanks :P)

(I try with ES2015 too, but I obtain the same error).

Test configuration does not work for Angular 1 typescript

Hello,

I created a project with Angular1, Typescript, webpack and SCSS.

I ran npm install and typings install.

When I run gulp test, I have the following errors :

[17:27:13] Loading /Users/pierrebaron/Sites/generator-fountain-webapp/gulp_tasks/misc.js
[17:27:13] Loading /Users/pierrebaron/Sites/generator-fountain-webapp/gulp_tasks/browsersync.js
[17:27:13] Loading /Users/pierrebaron/Sites/generator-fountain-webapp/gulp_tasks/karma.js
[17:27:13] Loading /Users/pierrebaron/Sites/generator-fountain-webapp/gulp_tasks/webpack.js
[17:27:14] Loading /Users/pierrebaron/Sites/generator-fountain-webapp/gulp_tasks/partials.js
[17:27:14] Using gulpfile ~/Sites/generator-fountain-webapp/gulpfile.js
[17:27:14] Starting 'test'...
[17:27:14] Starting 'karma:single-run'...
24 05 2016 17:27:14.600:WARN [preprocess]: Can not load "webpack"!
  Error: Passed 'options' object don't look like a valid webpack configuration
    at webpack (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/webpack/lib/webpack.js:19:10)
    at new Plugin (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/karma-webpack/index.js:50:17)
    at invoke (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/di/lib/injector.js:75:15)
    at Array.instantiate (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/di/lib/injector.js:59:20)
    at get (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/di/lib/injector.js:48:43)
    at /Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/di/lib/injector.js:71:14
    at Array.map (native)
    at Array.invoke (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/di/lib/injector.js:70:31)
    at get (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/di/lib/injector.js:48:43)
    at instantiatePreprocessor (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/karma/lib/preprocessor.js:52:20)
    at Array.forEach (native)
    at /Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/karma/lib/preprocessor.js:68:21
    at Array.forEach (native)
    at createPreprocessor (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/karma/lib/preprocessor.js:67:12)
    at Array.invoke (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/di/lib/injector.js:75:15)
    at get (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/di/lib/injector.js:48:43)
    at /Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/di/lib/injector.js:71:14
    at Array.map (native)
    at invoke (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/di/lib/injector.js:70:31)
    at Server.start (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/karma/lib/server.js:102:18)
    at karmaSingleRun (/Users/pierrebaron/Sites/generator-fountain-webapp/gulp_tasks/karma.js:18:15)
    at taskWrapper (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/undertaker/lib/set-task.js:13:15)
24 05 2016 17:27:14.660:WARN [karma]: Port 9876 in use
24 05 2016 17:27:14.661:INFO [karma]: Karma v0.13.22 server started at http://localhost:9877/
24 05 2016 17:27:14.664:INFO [launcher]: Starting browser PhantomJS
24 05 2016 17:27:15.421:INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#6l6bqkbkFEd49AIRAAAA with id 42625276
PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  ReferenceError: Can't find variable: require
  at /Users/pierrebaron/Sites/generator-fountain-webapp/src/index.spec.js:3


PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at /Users/pierrebaron/Sites/generator-fountain-webapp/src/app/footer.html.js:1


PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at /Users/pierrebaron/Sites/generator-fountain-webapp/src/app/header.html.js:1


PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at /Users/pierrebaron/Sites/generator-fountain-webapp/src/app/main.html.js:1


PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at /Users/pierrebaron/Sites/generator-fountain-webapp/src/app/techs/tech.html.js:1


PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at /Users/pierrebaron/Sites/generator-fountain-webapp/src/app/techs/techs.html.js:1


PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at /Users/pierrebaron/Sites/generator-fountain-webapp/src/app/title.html.js:1


PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  ReferenceError: Can't find variable: angular
  at /Users/pierrebaron/Sites/generator-fountain-webapp/src/index.html.js:1


[17:27:15] 'karma:single-run' errored after 1.18 s
[17:27:15] Error: Failed 1 tests.
    at /Users/pierrebaron/Sites/generator-fountain-webapp/gulp_tasks/karma.js:11:22
    at removeAllListeners (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/karma/lib/server.js:336:7)
    at Server.<anonymous> (/Users/pierrebaron/Sites/generator-fountain-webapp/node_modules/karma/lib/server.js:347:9)
    at Server.g (events.js:260:16)
    at emitNone (events.js:72:20)
    at Server.emit (events.js:166:7)
    at emitCloseNT (net.js:1521:8)
    at nextTickCallbackWith1Arg (node.js:431:9)
    at process._tickDomainCallback (node.js:394:17)
[17:27:15] 'test' errored after 1.18 s

Error On Freshly Scaffolded Angular 2 Todo-MVC

Description

Errors on npm run serve after fresh install of angular 2 ToDo-MVC.

Error Message & Stack Trace

This error shows in my command shell, but it seems to finish as if it's ok. Then I go to localhost:3000 in the browser, and it's just a white screen with empty console.

COPY THE ERROR MESSAGE, INCLUDING STACK TRACE HERE

ERROR in ./src/routes.ts
(14,42): error TS2345: Argument of type '() => TransitionPromise' is not assignable to parameter of type 'string | (($injector: any, $location: any) => string)'.
Type '() => TransitionPromise' is not assignable to type '($injector: any, $location: any) => string'.
Type 'TransitionPromise' is not assignable to type 'string'.

ERROR in ./src/index.ts
(14,45): error TS2305: Module '"/Users/jim/git2/Redux-Fountain-Library-Scaffold/node_modules/ui-router-ng2/ng2"' has no exported member 'UiView'.
Child

Config

Copy the content from .yo-rc.json:
{
"generator-fountain-angular2": {
"version": "0.5.4",
"props": {
"framework": "angular2",
"modules": "webpack",
"js": "typescript",
"css": "scss",
"resolved": "/usr/local/lib/node_modules/generator-fountain-webapp/node_modules/generator-fountain-angular2/generators/app/index.js",
"namespace": "fountain-angular2",
"argv": {
"remain": [],
"cooked": [],
"original": []
},
"skip-cache": false,
"skip-install": false,
"sample": "todoMVC",
"router": "uirouter"
}
}
}

Relevant Links

https://github.com/JimTheMan/Redux-Fountain-Library-Scaffold

Environment

Tell us which operating system you are using, as well as which versions of Node.js, npm, and yo. Run the following to get it quickly:

npm: 3.8.6
node: v6.0.0
yo: 1.8.4

Site web: Dead links

Hi,
there's some dead link on your website especially on http://fountainjs.io/doc

Landing Page Will Not Load in IE11

I have not had time to test too many variations, but the 'landing page' option will not build when using Angular 2 + TypeScript + WebPack/NPM

The only error given is: SCRIPT438: Object doesn't support property or method 'keys'

Changing the user agent in Chrome to IE does not produce the error. The Angular 2 cli does not create this error. I will try to test a few others when I have some time, but wanted to go ahead and raise the issue.

Sub generators

I couldn't find this in the documentation, but are there sub-generators for creating various app components like directives services or components?

templateCache not working when manual bootstrapping angular1 app

I have been trying out this awesome generator v0.4.0 using:

? Which JavaScript framework do you want? Angular 1
? Which module management do you want? Webpack with NPM
? Which CSS preprocessor do you want? SASS
? Which JS preprocessor do you want? TypeScript

I am working here with the default app that is being generated.

When building the app and webpack outputs the index-[hash].js the templateCache is not working, the problem is that when the app is manually bootstrapped the angular run function that contains the templateCache is not executing.
This is because the angular app module is set and being bootstrapped after the run function that contains the templateCache:

/***/ },
/* 1 */
/***/ function(module, exports, __webpack_require__) {

    "use strict";
    var angular = __webpack_require__(0);
    angular.module("app").run(["$templateCache", function ($templateCache) {
            $templateCache.put("app/footer.html", "<footer class=\"footer\">\n  Build with ♥ by the&nbsp;\n  <a href=\"https://github.com/orgs/FountainJS/people\">\n    FountainJS teamh\n  </a>\n</footer>\n");
            $templateCache.put("app/header.html", "<header class=\"header\">\n  <p class=\"header-title\">\n    <a href=\"https://github.com/FountainJS/generator-fountain-webapp\" target=\"_blank\">\n      Foutain Generator\n    </a>\n  </p>\n  <p class=\"header-date\">\n    Generated with FountainJS v0.4.0 on Sat Apr 16 2016 17:39:35 GMT+0200 (South Africa Standard Time)\n  </p>\n</header>\n");
            $templateCache.put("app/main.html", "<div class=\"main-container\">\n  <fountain-header></fountain-header>\n  <main class=\"main\">\n    <fountain-title></fountain-title>\n    <fountain-techs></fountain-techs>\n  </main>\n  <fountain-footer></fountain-footer>\n</div>\n");
            $templateCache.put("app/title.html", "<div class=\"title\">\n  <h1 class=\"title-h1\">\'Allo, \'Allo!</h1>\n  <div>\n    <img class=\"title-logo\" src=\"https://raw.githubusercontent.com/FountainJS/generator-fountain-webapp/master/docs/assets/yeoman.png\">\n    <img class=\"title-logo\" src=\"https://raw.githubusercontent.com/FountainJS/generator-fountain-webapp/master/docs/assets/fountain.png\">\n  </div>\n  <h2 class=\"title-h2\">Always a pleasure scaffolding your apps...</h2>\n    <input type=\"text\">\n</div>\n");
            $templateCache.put("app/techs/tech.html", "<div class=\"tech\">\n  <img class=\"tech-logo\" ng-src=\"{{ $ctrl.tech.logo }}\">\n  <h3 class=\"tech-h3\">\n    {{ $ctrl.tech.title }}\n  </h3>\n  <p>{{ $ctrl.tech.text1 }}</p>\n  <p>{{ $ctrl.tech.text2 }}</p>\n</div>\n");
            $templateCache.put("app/techs/techs.html", "<div class=\"techs-container\">\n  <h2 class=\"techs-h2\">\n    Cooked with all these awesome technologies:\n  </h2>\n  <div class=\"techs\">\n    <fountain-tech ng-repeat=\"tech in $ctrl.techs\" tech=\"tech\"></fountain-tech>\n  </div>\n</div>\n");
        }]);
/***/ },
/* 2 */
/***/ function(module, exports, __webpack_require__) {

    "use strict";
    var angular = __webpack_require__(0);
    var index_1 = __webpack_require__(9);
    var main_1 = __webpack_require__(8);
    var header_1 = __webpack_require__(7);
    var title_1 = __webpack_require__(12);
    var footer_1 = __webpack_require__(6);
    __webpack_require__(14);
    angular
        .module('app', [index_1.techsModule])
        .component('app', main_1.main)
        .component('fountainHeader', header_1.header)
        .component('fountainTitle', title_1.title)
        .component('fountainFooter', footer_1.footer);
    angular.bootstrap(document, ['app']);
/***/ },

I have been searching for a way to add the templateCache after the angular module gets created and before the app is bootstrapped but so far no success.
The only way I could get it to build is by removing the manual bootstrapping function angular.bootstrap(document, ['app']) and adding ng-app="app" to index.html.

Stylus

Any plans to add Jade and Stylus as options? generator-gulp-angular had those so I'm sad to see they're not included.

unable to debug.

Trying to set breakpoints on the app in Intellij, but breakpoints being totally ignore (not even active when starting a debugger). I've setup a debug configuration as documented here https://blog.jetbrains.com/webstorm/2015/09/debugging-webpack-applications-in-webstorm/ however not having any success. I've left the devtool as is in the webpack.conf ('cheap-module-eval-source-map')

the debugger seems to start fine, but no breakpoints are recognized. Also, I should point out that the webpack:///. src directory only has *scss files and no js files. Not sure if that matters or not?

Any ideas?

Watcher for typescript not working

With npm run serve changing the "Hello World" string in the hello.ts doesn't reload the webapp with browsersync. systemjs, typescript, angular2

gulp serve:dist not working

Installing the generator with:

• Anugular 1
• None with Bower and script injection
• ES2015 today with Babel
• SASS
• A working landing page

when running gulp serve:dist, all I can see is the Loading... message and no JS errors.
The template file seems correctly generated and also all the other minified files. I can't figure out what is missing.

Question - Remove maps on build

Hi, How can I remove the source maps on build to production? and is there a way to color the menu bar to reflect if the app are running against a test or production database?

I would also like to remove the angular html cache and just minify the HTML

Module build failed: Error: Couldn't find preset "es2015"

on a fresh new project

(18:06:05):~/dev/tests/my-new-project (master *)$ yo fountain-webapp
? Which JavaScript framework do you want? React
? Which module management do you want? Webpack with NPM
? Which CSS preprocessor do you want? CSS
? Which JS preprocessor do you want? Pure old JavaScript
? Do you want a sample app? Just a Hello World
...
...
(18:06:54):~/dev/tests/my-new-project (master)$ gulp
[18:07:08] Loading /Users/sebas/dev/tests/my-new-project/gulp_tasks/misc.js
[18:07:08] Loading /Users/sebas/dev/tests/my-new-project/gulp_tasks/browsersync.js
[18:07:08] Loading /Users/sebas/dev/tests/my-new-project/gulp_tasks/karma.js
[18:07:09] Loading /Users/sebas/dev/tests/my-new-project/gulp_tasks/webpack.js
[18:07:09] Using gulpfile ~/dev/tests/my-new-project/gulpfile.js
[18:07:09] Starting 'default'...
[18:07:09] Starting 'clean'...
[18:07:09] Finished 'clean' after 4.66 ms
[18:07:09] Starting 'build'...
[18:07:09] Starting 'other'...
[18:07:09] Starting 'webpack:dist'...
[18:07:09] Finished 'other' after 38 ms
[18:07:09] Time: 236ms

ERROR in ./src/index.js
Module build failed: Error: Couldn't find preset "es2015" relative to directory "/Users/sebas/dev/tests/my-new-project"
    at /Users/sebas/dev/tests/my-new-project/node_modules/babel-core/lib/transformation/file/options/option-manager.js:393:17
    at Array.map (native)
    at OptionManager.resolvePresets (/Users/sebas/dev/tests/my-new-project/node_modules/babel-core/lib/transformation/file/options/option-manager.js:385:20)
    at OptionManager.mergePresets (/Users/sebas/dev/tests/my-new-project/node_modules/babel-core/lib/transformation/file/options/option-manager.js:369:10)
    at OptionManager.mergeOptions (/Users/sebas/dev/tests/my-new-project/node_modules/babel-core/lib/transformation/file/options/option-manager.js:328:14)
    at OptionManager.addConfig (/Users/sebas/dev/tests/my-new-project/node_modules/babel-core/lib/transformation/file/options/option-manager.js:234:10)
    at OptionManager.findConfigs (/Users/sebas/dev/tests/my-new-project/node_modules/babel-core/lib/transformation/file/options/option-manager.js:434:16)
    at OptionManager.init (/Users/sebas/dev/tests/my-new-project/node_modules/babel-core/lib/transformation/file/options/option-manager.js:482:12)
    at File.initOptions (/Users/sebas/dev/tests/my-new-project/node_modules/babel-core/lib/transformation/file/index.js:211:75)
    at new File (/Users/sebas/dev/tests/my-new-project/node_modules/babel-core/lib/transformation/file/index.js:129:22)
    at Pipeline.transform (/Users/sebas/dev/tests/my-new-project/node_modules/babel-core/lib/transformation/pipeline.js:48:16)
    at transpile (/Users/sebas/dev/tests/my-new-project/node_modules/babel-loader/index.js:14:22)
    at Object.module.exports (/Users/sebas/dev/tests/my-new-project/node_modules/babel-loader/index.js:88:12)
[18:07:09] Finished 'webpack:dist' after 253 ms
[18:07:09] Finished 'build' after 260 ms
[18:07:09] Finished 'default' after 266 ms
(18:07:10):~/dev/tests/my-new-project (master)$

Generator not working

I'm using OSX 10.11.4 with Node 5.10.1 and NPM 3.8.3

I just run the instructions:

1. npm install -g yo gulp-cli
2. npm install -g generator-fountain-webapp
3. yo fountain-webapp

But I get this error:

module.js:341
    throw err;
    ^

Error: Cannot find module 'mem-fs'
    at Function.Module._resolveFilename (module.js:339:15)
    at Function.Module._load (module.js:290:25)
    at Module.require (module.js:367:17)
    at require (internal/module.js:16:19)
    at Object.<anonymous> (/usr/local/lib/node_modules/generator-fountain-webapp/node_modules/fountain-generator/lib/test-utils.js:2:15)
    at Module._compile (module.js:413:34)
    at Object.Module._extensions..js (module.js:422:10)
    at Module.load (module.js:357:32)
    at Function.Module._load (module.js:314:12)
    at Module.require (module.js:367:17)

Unable to install jspm dependency

Npm install crash when install jspm

npm ERR! git rev-list -n1 6c85e03c9bfee63bf17408b483b15b444b7f1ada: fatal: bad object 6c85e03c9bfee63bf17408b483b15b444b7f1ada

Node Version: 4.4.4
Npm Version: 3.9.2

Yeoman Generator Choices:

? Which JavaScript framework do you want? React
? Which module management do you want? SystemJS with JSPM
? Which JS preprocessor do you want? ES2015 today with Babel
? Which CSS preprocessor do you want? SASS
? Do you want a sample app? A working landing page

I reproduce this problem with Angular2 as JavaScript framework

[EDIT]

Use "jspm": "^0.17.0-beta.15" instead of "jspm": "jspm/jspm#6c85e03c9bfee63bf17408b483b15b444b7f1ada" correct the problem.

JSPM team released 0.17.0-beta.15 today https://github.com/jspm/jspm-cli/releases/tag/0.17.0-beta.15

No code coverage for Angular 1 Typescript

Hi, I used the v0.5 version of the generator. I just created a new app and ran gulp test. Even though a coverage/ folder has been created with the different files, when I open the index.html, I have no information about my code coverage.

Requirements mem-fs

I need to install mem-fs and mem-fs-editor to be able to launch a yo fountain-webapp.

What's next

Some people asked us about the next focuses and goals of the project. Here ours list as it is. We don't really order things and pick next subjects part because of the trends, part because of our will :)

Of course, any contribution on one of these subjects will be more than welcome.

To finish

• Codelab http://yeoman.io/codelab
• TodoMVC
• Isomorphic pre-rendering post

Missing

• Routing
• UI frameworks?
• More blog posts

New generators

• Frameworks
  • Polymer
  • Ember 2
  • VueJS 2
  • Backbone
• Module system
  • Browserify
• CSS
  • PostCSS / CSSNext
  • Stylus

Web site

• Home per framework
• Pre - generated archives

Refactoring

• Renaming generators eslint and tslint
• Merging all Techs css

Improving

• Ordering for json2js
• Comment for json2js
• Improve Unit Test coverage
• Move integration tests on TodoMVC
• Angular 2 external template
• Using yo-rc instead of this.options

Proof of concetps

• Isomorphism
• Backend
• Mobile

build: SystemJS is not defined

Hello,

Testing v0.4.0.

? Which JavaScript framework do you want? Angular 1
? Which module management do you want? SystemJS with JSPM
? Which CSS preprocessor do you want? SASS
? Which JS preprocessor do you want? ES2015 today with Babel
? Do you want a sample app? A working landing page

$ ./node_modules/.bin/jspm install
...
ok   Install complete.

$ npm test
...
PhantomJS 2.1.1 (Linux 0.0.0): Executed 6 of 6 SUCCESS (0.086 secs / 0.058 secs)
[14:41:24] Finished 'karma:single-run' after 2.78 s

Then running build fails with SystemJS, no matter if selected above is Angular 1 or 2, ES5 or ES6. But running npm run serve ends successfully.

$ npm run build
[14:41:56] Starting 'default'...
[14:41:56] Starting 'clean'...
[14:41:56] Finished 'clean' after 6.37 ms
[14:41:56] Starting 'build'...
[14:41:56] Starting 'partials'...
[14:41:56] Finished 'partials' after 66 ms
[14:41:56] Starting 'systemjs'...
[14:41:56] Starting 'systemjs:html'...
[14:41:56] Starting 'styles'...
[14:41:56] Starting 'other'...
[14:41:56] 'systemjs' errored after 285 ms
[14:41:56] ReferenceError: SystemJS is not defined
    at evalmachine.<anonymous>:1:1
    at ContextifyScript.Script.runInNewContext (vm.js:18:15)
    at Object.exports.runInNewContext (vm.js:49:17)
    at Builder.executeConfigFile (/somepath/node_modules/systemjs-builder/lib/builder.js:276:17)
    at Builder.loadConfigSync (/somepath/node_modules/systemjs-builder/lib/builder.js:286:21)
    at new Builder (/somepath/node_modules/systemjs-builder/lib/builder.js:52:10)
    at systemjs (/somepath/gulp_tasks/systemjs.js:12:19)
    at taskWrapper (/somepath/node_modules/undertaker/lib/set-task.js:13:15)
    at taskWrapper (/somepath/node_modules/undertaker/lib/set-task.js:13:15)
    at taskWrapper (/somepath/node_modules/undertaker/lib/set-task.js:13:15)
[14:41:56] 'build' errored after 352 ms
[14:41:56] 'default' errored after 361 ms
[14:41:56] The following tasks did not complete: systemjs:html, styles, other
[14:41:56] Did you forget to signal async completion?

After changing SystemJS.config to System.config in jspm.config.js, the error message changed to the following:

$ npm run build
...
[14:53:58] Starting 'other'...
[14:53:59] 'systemjs' errored after 473 ms
[14:53:59] Error on translate for src/index.js at file:///somepath/src/index.js
    Error: Unable to fetch "npm:[email protected]". Only file URLs of the form file:/// allowed running in Node.
    at fetchTextFromURL (/somepath/node_modules/systemjs-builder/node_modules/systemjs/dist/system.src.js:1071:15)
    at /somepath/node_modules/systemjs-builder/node_modules/systemjs/dist/system.src.js:1623:7
    at new Promise (/somepath/node_modules/karma/node_modules/core-js/modules/es6.promise.js:193:7)
    at SystemJSNodeLoader.<anonymous> (/somepath/node_modules/systemjs-builder/node_modules/systemjs/dist/system.src.js:1622:12)
    at SystemJSNodeLoader.<anonymous> (/somepath/node_modules/systemjs-builder/node_modules/systemjs/dist/system.src.js:2543:22)
    at SystemJSNodeLoader.<anonymous> (/somepath/node_modules/systemjs-builder/node_modules/systemjs/dist/system.src.js:3108:20)
    at SystemJSNodeLoader.<anonymous> (/somepath/node_modules/systemjs-builder/node_modules/systemjs/dist/system.src.js:3336:18)
    at SystemJSNodeLoader.<anonymous> (/somepath/node_modules/systemjs-builder/node_modules/systemjs/dist/system.src.js:3956:20)
    at SystemJSNodeLoader.<anonymous> (/somepath/node_modules/systemjs-builder/node_modules/systemjs/dist/system.src.js:4147:22)
    at SystemJSNodeLoader.<anonymous> (/somepath/node_modules/systemjs-builder/node_modules/systemjs/dist/system.src.js:4383:20)
    at /somepath/node_modules/systemjs-builder/node_modules/systemjs/dist/system.src.js:2300:49
    at /somepath/node_modules/systemjs-builder/node_modules/systemjs/dist/system.src.js:2346:11
    at run (/somepath/node_modules/karma/node_modules/core-js/modules/es6.promise.js:89:22)
    at /somepath/node_modules/karma/node_modules/core-js/modules/es6.promise.js:102:28
    at flush (/somepath/node_modules/karma/node_modules/core-js/modules/_microtask.js:14:5)
    at _combinedTickCallback (internal/process/next_tick.js:67:7)
    at process._tickDomainCallback (internal/process/next_tick.js:122:9)

P.S. Using Node.js v5.10.1

Error with [email protected]

Hello,

? Which JavaScript framework do you want? Angular 2
? Which module management do you want? Webpack with NPM
? Which CSS preprocessor do you want? SASS
? Which JS preprocessor do you want? TypeScript

IMO there is a pb with the last angular version (currently 2.0.0-beta.7). It was downloaded when we have generated the template

── [email protected] 

There was many errors at the execution:

ERROR in /workspace/node_modules/angular2/src/core/linker/compiler.d.ts
(12,50): error TS2304: Cannot find name 'Promise'.
...

I think it would be safer to use "angular2": "2.0.0-beta.0" without ^ in the dependencies.
Also, your generator doesn't seem to work.

My workaround, when I've finished to generate my template :

$ npm install [email protected] [email protected]

Thanks

Upgrade to ui-router v1.x

Description

Current version of angular ui-router (0.3.x) does not support to route to angular 1.5 components.

However, last version (currently 1.0.0-beta.1) supports a new 'component' attribute, with various syntaxes.

Let's upgrade, or use this polyfill: https://github.com/softsimon/ui-router-route-to-components

We should also add an example in the gererator.

e.g. for a component named "fleet":

fleet/fleet.js

module.exports = {
  templateUrl: 'app/fleet/fleet.html',
  controller: Fleet,
  bindings: {
    todos: '=',
    filter: '<'
  }
};

/** @ngInject */
function Fleet($log) {
  this.$onInit = function () {
    $log.info('Hi there!');
  };
}

index.js

var FleetComponent = require('./app/fleet/fleet');
// [...]
angular
  .component('fleetComponent', FleetComponent);

route.js

.state('fleet', {
            url: '/fleet',
            component: 'fleetComponent'
        })

Config

{
  "generator-fountain-angular1": {
    "version": "0.5.4",
    "props": {
      "framework": "angular1",
      "modules": "webpack",
      "js": "js",
      "css": "scss",
      "resolved": "/usr/local/lib/node_modules/generator-fountain-webapp/node_modules/generator-fountain-angular1/generators/app/index.js",
      "namespace": "fountain-angular1",
      "argv": {
        "remain": [],
        "cooked": [],
        "original": []
      },
      "skip-cache": false,
      "skip-install": false,
      "sample": "todoMVC",
      "router": "uirouter"
    }
  }
}

Relevant Links

• angular-ui/ui-router#2627
• angular-ui/ui-router#2547

Feature request: Keep tsconfig.json in the project root folder.

Description

Keep tsconfig.json in the project root folder. Do not move it to /conf/ts.conf.json.

Rationale

• Every editor out there which supports TypeScript looks for ./tsconfig.json in root project folder. Moving this file to /conf/ts.conf.json breaks this convention and disables the most advanced features of editors (e.g. code insight).
• The TypeScript Handbook is very clear about this subject:

The presence of a tsconfig.json file in a directory indicates that the directory is the root of a TypeScript project.

• An experienced TypeScript user coming to a new project generated by FountainJS would find awkward to not find the tsconfig.json file in the root folder.
• Lastly, the current non-standard location of this file requires the following section to be added in /conf/webpack*.conf.js files

  ts: {
    configFileName: 'conf/ts.conf.json'
  },

Moving the file back to the root folder allow us to remove this section entirely from these three files (webpack.conf.js, webpack-dist.conf.js and webpack-test.conf.js).

Relevant Links

List of editors supporting TypeScript:

https://github.com/Microsoft/TypeScript/wiki/TypeScript-Editor-Support

Browserify

Why was Browserify not added?

build: SystemJS and script tags

Hi,

While doing a build, systemjs version replaces all script tags in index.html (gulp_tasks/systemjs.js):

function updateIndexHtml() {
  return gulp.src(conf.path.src('index.html'))
    .pipe(replace(
      /<script[\s\S]*script>/,
      `<script src="index.js"></script>`
    ))
    .pipe(gulp.dest(conf.path.tmp()));
}

The problem is that this also removes all custom script tags, for example I want to use a script with a type text/ng-template. While having this, that simple regex breaks the final build -- the index.js in dist is never created.

As a workaround to this I wrapped the html code and changed the updateIndexHtml().

index.html:

    <!-- systemjs:code -->
    <!-- build:js(.tmp) index.js -->
    <script src="jspm_packages/system.js"></script>
    <script src="jspm.browser.js"></script>
    <script src="jspm.config.js"></script>

    <script>
      System.import('src/index.js');
    </script>
    <!-- endbuild -->
    <!-- systemjs:endcode -->

systemjs.js:

function updateIndexHtml() {
  return gulp.src(conf.path.src('index.html'))
    .pipe(replace(
      /<!-- systemjs:code -->[\s\S]*<!-- systemjs:endcode -->/,
      `<!-- build:js(.tmp) index.js -->
    <script src="index.js"></script>
    <!-- endbuild -->`
    ))
    .pipe(gulp.dest(conf.path.tmp()));
}

Please consider this or some better solution.