There are only one partial registry in the handlebars engine.
We need to set a wildcard path to register partial by path name.

Since we use gulp-hbs as "handlebars template engine", we have 2 modules to do approximatively same thing.
To reduce dependencies number I think to remove dependency to gulp-hbs.
We need to rework doc:static task.

Le moteur de template de handlebars ne permet pas de changer de layout.

La page courante est enregistré comme partial body dans le layout.

Nous devrions utiliser les "block partial" afin de gérer les layouts.

En attendant la V3, est-ce qu'on peut avoir un GSK light avec uniquement ce qui est recommandé ? Sass, Twig et Webpack ? C'est pour les nouveaux projets qui n'ont pas besoin de tout le reste et ça évite de devoir les supprimer à la main.

GSK is way faster without the "doc" task. Yeah, I know, KSS is great, but we don't always need it, so it shouldn't be activate by default.

Just like gulp live --relax a gulp live --doc seems to be a good way to have a live documentation option without making GSK slower most of the time.

Permet de ne pas compiler les js inutile a tel ou tel device, et d ainsi ne charger que ce qui est nécessaire

The --optimize option seems ignored

NB: Tested with compass builder

Maybe relative to #50

We need to be able to deliver a build otimized with documentation.

Hello !

We need a task to deploy a static build of curent version on a sftp server.

• projectname-0.1.0/
• projectname-0.2.0/

We need to keep optimize build and docs on it.

Il apparaît dans la console des warning pour tous les fichiers json qui ne sont pas trouvés qui ce soit pour les partials de pages, ou les partials de template "ui".

Avoir des warning pour les partials de pages non trouvés, ok mais pas nécessaire pour les autres templates (ui/layout).

Browser sync is refreshing too early before the end of sass and twig are done.

Avoir la possibilité d'ajouter, via des paramètres, des plugins PostCSS ainsi que leur propres paramètres à chacun; voire même de ne faire que du PostCSS, sans pre-processing du tout.

CSSNext, par exemple, embarque autoprefixer et pourrait entrer en conflit avec celui déjà installé.

gulp.task('css', ['test:css'], function () {
  return gulp.src(SRC)
    .pipe(plumber({ errorHandler: err }))
    .pipe(pipeline())
    .pipe(postcss([
      autoprefixer(APX_CONF)
    ]))
    .pipe(gulp.dest(DEST))
    .pipe(bs.stream());
});

https://github.com/cleverage/garden-starter-kit/tree/master/.gsk/docs/js
and in https://github.com/cleverage/garden-starter-kit/blob/master/readme.md#L260

To upgrade.

Ajouter une tâche pour les fonts de glyphes fontello.
Afin de facilité la migration de projet sous le starter kit v1

Actuellement, tous les fichier JS présent dans src/js sont concaténer en fonction de l'ordre alphabétique des fichiers.

L'idéale serait de gérer les JS via les import ES6, enfin de pouvoir créer un ou plusieurs JS séparer et non plus avoir un seul fichier avec tout de concaténer.

Il serait idéal aussi de pouvoir séparer des JS issue de sources client (si l'ont doit reprendre des JS d'une version desktop pour un inté mobile) afin de ne pas polluer le JS mobile dédié.

Je n'ai pas regarder en détail le fonctionnement de la gestion actuelle des JS, mais ça parait contraignant.

https://github.com/shannonmoeller/gulp-hb/releases/tag/v6.0.0

Sass and Twig partials aren't always detected, I have to stop gulp live --relaxand relaunch it to have my files compiled. (Well that's not a major issue, when you're used to it).

Usages examples :

Twig :

New file _select.twig in : src/html/styleguide
Import {% include '../styleguide/_select.twig' %} in src/html/page/my-page.twig
--> Not detected

Sass :

New file _select.scss in : src/css/ui
Import @import "07_ui/**"; in src/css/style.css
--> Not detected (maybe it's because I'm using Sass-globbing ? refs #22 )

"devDependencies": {
    "autoprefixer": "^6.0.3",
    "babel-preset-es2015": "^6.3.13",
    "babelify": "^7.2.0",
    "browser-sync": "^2.9.10",
    "browserify": "^12.0.1",
    "del": "^2.0.2",
    "glob": "^5.0.15",
    "gulp": "^3.9.0",
    "gulp-a11y": "^0.1.1",
    "gulp-compass": "^2.1.0",
    "gulp-concat": "^2.6.0",
    "gulp-data": "^1.2.0",
    "gulp-dox": "^0.1.6",
    "gulp-hbs": "^0.2.0",
    "gulp-if": "^2.0.0",
    "gulp-imagemin": "^2.3.0",
    "gulp-jscs": "^3.0.2",
    "gulp-jshint": "^2.0.0",
    "gulp-less": "^3.0.3",
    "gulp-lesshint": "^1.0.0",
    "gulp-markdown": "^1.2.0",
    "gulp-newer": "^0.5.1",
    "gulp-plumber": "^1.0.1",
    "gulp-postcss": "^6.0.1",
    "gulp-prettify": "^0.3.0",
    "gulp-scss-lint": "^0.3.6",
    "gulp-sourcemaps": "^1.6.0",
    "gulp-stylint": "^3.0.0",
    "gulp-stylus": "^2.1.0",
    "gulp-twig": "^0.4.0",
    "gulp-uglify": "^1.4.2",
    "gulp-util": "^3.0.6",
    "highlight.js": "^8.9.1",
    "jshint": "^2.9.1",
    "jshint-stylish": "^2.0.1",
    "kss": "^2.1.1",
    "lazypipe": "^1.0.1",
    "nproxy": "stephane-tessier/nproxy#1.7.0",
    "require-dir": "^0.3.0",
    "run-sequence": "^1.1.4",
    "through2": "^2.0.0",
    "underscore": "^1.8.3",
    "vinyl-buffer": "^1.0.0",
    "vinyl-source-stream": "^1.1.0",
    "yargs": "^4.3.2"
  }

• Différencier les dependencies et devDependencies (pas besoin d'installer de watcher sur une prod...)
• Fixer les versions (plus sûr)

Do not write a rule in the .gitignore if it concerns only your operating system or IDE.

Add sub-folder in the Sass folder an error at compilation:
[15:57:49] Starting 'test:css'... ^[[A[15:57:51] Finished 'test:css' after 2.23 s [15:57:51] Starting 'css'... [ERROR] uncaughtException: Cannot read property 'type' of null

Seems to come from PostCSS, an upgrade to 6.1.1 solve the problem.

Would you love a static analysis of the generated CSS on-the-go, like Parker ?

Use 👍 and 👎 in reactions to vote.

PARKER-JS
Total Stylesheets: 1
Total Stylesheet Size: 12384
Total Rules: 158
Total Selectors: 209
Total Identifiers: 448
Total Declarations: 362
Selectors Per Rule: 1.3227848101265822
Identifiers Per Selector: 2.1578947368421053
Specificity Per Selector: 18.0622009569378
Top Selector Specificity: 110
Top Selector Specificity Selector: #cookies-monster .more
Total Id Selectors: 3
Total Unique Colors: 42
Unique Colors: #515151,#FFFFFF,#268BD2,#303030,#EEEEEE,#555555,#E5E5E5,#BF616A,#F9F9F9,#7A7A7A,#717171,#505050,#C0C0C0,#9A9A9A,#999999,#CCCCCC,#F5F5F5,#C3F4DC,#002B36,#93A1A1,#151515,#AC4142,#F4BF75,#D0D0D0,#90A959,#6A9FB5,#AA759F,#D28445,#75B5AA,#8F5536,#202020,#EED9D9,#F6E6DA,#FDF2E3,#E9EEDE,#E3F0EE,#E1ECF0,#EEE3EC,#E9DDD6,#111111,#333333,#000000
Total Important Keywords: 2
Total Media Queries: 7
Media Queries: (min-width: 38em),(min-width: 30em),(min-width: 48em),(min-width: 58em),(min-width: 64em),all,only screen and (max-width: 1024px)

Well, dunno if I'm the only one around here, but I'm using sass-globbing to make lazy sass partials import :

 // Éléments de l'interface utilisateur
  @import "07_ui/**";

  // Surcharge spécifique pour une page
  @import "08_pages/*";

So I'm always adding those lines in config.rb

# Require any additional compass plugins here.
require 'sass-globbing'

(C'est pas un VRAI soucis j'entends bien, surtout si je suis le seul à faire ça, mais je trouve ça bien pratique :) )

It is nowadays a best practice to inline some short CSS and JS for better webperf.

It would be nice to have an easy way to mark in a twig template where an external JS or CSS has to be inlined after compilation (if Sass or ES2015) and minification.

For example, the Jekyll Assets plugin for Jekyll let me do this:
https://github.com/nhoizey/nicolas-hoizey.com/blob/master/_includes/head.html#L8-L15

Some dependencies have assets (glyphicons in bootstrap) needed in the build.
So we need a task to copy it in the build directory.

Some project have some external private ressources needed in the build to.

Make a 'gulp help' commande (maybe as default) to help dev to find the good commande.
Because:

1. Dev do not read docs
2. I don't want search in doc when i'm on the terminal window
3. Easier for noob

Browserify use commonjs module natively.
But many plugin we use are not commonjs.

Find a way to use other modules format like AMD.

Maybe a good way :
http://dontkry.com/posts/code/browserify-and-the-universal-module-definition.html

Keep it configurable.

Seems to be around https://github.com/cleverage/garden-starter-kit/blob/master/.gsk/pipe/js/browserify.js#L49

for exemple for display: flex with default configuration in config.json

readme.md should be document how to init a project with gsk and how to contribute to the projet

But readme.md in project should document how to use the project and how to contribute.

Line 7 in src/html/layouts/_default.twig

You should remove chrome=1 in this meta as Google frame is retired.
It's a really small issue and probably not important, but it is reported as an error on the W3C Markup validator tool.

See: Google frame is no longer supported and retired

Une erreur dont je n'ai pas réussi à identifier la source.

Apparement, inclure une partial d'un sous dossier dans une autre partials ne fonctionne pas. Un boucle d'erreur apparait dans la console.
Ex :

• _ui:
  • _sections
    - _sous-partial.twig
  • _partial.twig
• Page
  • ma-page.twig

Inclure _sous-partial.twig depuis ma-page.twig fonctionne, mais depuis _partial.twig ne semble pas fonctionner.

Dans le fichier de config les chemin vers les chemins de bases sont répété plusieurs fois.
Afin de facilité là config il serait intéressant de pouvoir les factoriser.

{
 …
  "css" : {
    "src-dir"     : "./src/css",
    "dest-dir"    : "./build/css",
     …
  },
  "html" : {
    "src-dir"  : "./src/html",
    "dest-dir" : "./build",
    …
  },
  "js" : {
    "src-dir"  : "./src/js",
    "dest-dir" : "./build/js",
    …
  },
  "images": {
    "src-dir"  : "./src/assets/img",
    "dest-dir" : "./build/img"
    …
  },
  "assets": {
    "src-dir"  : "./src/assets",
    "dest-dir" : "./build"
    …
  },
  "connect": {
    "baseDir"  : "./build"
    …
  },
  "doc": {
    "src-dir"  : "./docs",
    "dest-dir" : "./build/doc"
  }
}

Make a github page for GSK

Find a tool to test visual regression
and difference between browsers

Permet de charger le bon fichier en fonction du device (doit etre largement possible avec browserify, du coup un exemple serait top)

New kss provides new features.
A standalone page for each markup example (ideal for visual regression test)

Sometimes git remote is initialized with a first commit of a readme.md.
The installation process described in readme.md can't be used is this case.

We need a licence for this free and open-sources project.
@nhoizey proposed MIT.

It seems not so complicated http://webpack.github.io/docs/webpack-for-browserify-users.html

All sub folders in /css (where Sass files are) are also copied in the build folder when building, but are empty.

Could be good if just folders that contains _my-partial.scss (with underscore) can be copied, of if we can add an underscore to ignore them like partials.

Ajouter une tache pour la gestions des symbols svg.
A préférer aux font quand le scope navigateur projet le permet.

It cause more troubles than benefits.

To remove ruby dependancies.

• Use node-sass by default
• replace scss-lint by sass-lint

issue with the line .pipe(gif(ENV.all.optimize, uglify())) in the concat.js task.
It doesn't uglify, so I remove gif function : .pipe(uglify()) and it works.

The var ENV.all.optimize return the right value, according to the config (boolean).

Dev need more informations for usage of browsersync

To avoid misunderstanding (like #76) we should document some exemple of webpack usage.

Or replace it by an automatically generated report.