Added SCSS preprocessor the yeoman generator
diff --git a/views/ngXosLib/generator-xos/app/index.js b/views/ngXosLib/generator-xos/app/index.js
index 547a8f9..9fab96f 100755
--- a/views/ngXosLib/generator-xos/app/index.js
+++ b/views/ngXosLib/generator-xos/app/index.js
@@ -97,6 +97,13 @@
{fileName: this._fistCharToUpper(config.name)}
);
},
+ css: function(){
+ this.fs.copyTpl(
+ this.templatePath('src/sass/main.scss'),
+ this.destinationPath(`${this.config.get('folder')}/${config.name}/src/sass/main.scss`),
+ {fileName: this._fistCharToUpper(config.name)}
+ );
+ },
mainJs: function(){
this.fs.copyTpl(
this.templatePath('src/js/main.js'),
diff --git a/views/ngXosLib/generator-xos/app/templates/gulp/build.js b/views/ngXosLib/generator-xos/app/templates/gulp/build.js
index b232ef9..bd31a25 100644
--- a/views/ngXosLib/generator-xos/app/templates/gulp/build.js
+++ b/views/ngXosLib/generator-xos/app/templates/gulp/build.js
@@ -23,10 +23,6 @@
var rename = require('gulp-rename');
var replace = require('gulp-replace');
-var TEMPLATE_FOOTER = `}]);
-angular.module('xos.<%= name %>').run(function($location){$location.path('/')});
-angular.bootstrap(angular.element('#xos<%= fileName %>'), ['xos.<%= name %>']);`;
-
module.exports = function(options){
// delete previous builded file
@@ -37,6 +33,43 @@
);
});
+ // inject CSS
+ gulp.task('injectCss', function(){
+ return gulp.src(options.src + 'index.html')
+ .pipe(
+ inject(
+ gulp.src(options.src + 'css/*.css'),
+ {
+ ignorePath: [options.src]
+ }
+ )
+ )
+ .pipe(gulp.dest(options.src));
+ });
+
+ // minify css
+ gulp.task('css', function () {
+ var processors = [
+ autoprefixer({browsers: ['last 1 version']}),
+ mqpacker,
+ csswring
+ ];
+
+ gulp.src([
+ `${options.css}**/*.css`,
+ `!${options.css}dev.css`
+ ])
+ .pipe(postcss(processors))
+ .pipe(gulp.dest(options.tmp + '/css/'));
+ });
+
+ // copy css in correct folder
+ gulp.task('copyCss', ['css'], function(){
+ return gulp.src([`${options.tmp}/css/*.css`])
+ .pipe(concat('xosDiagnostic.css'))
+ .pipe(gulp.dest(options.static + 'css/'))
+ });
+
// compile and minify scripts
gulp.task('scripts', function() {
return gulp.src([
@@ -54,8 +87,7 @@
return gulp.src('./src/templates/*.html')
.pipe(templateCache({
module: 'xos.<%= name %>',
- root: 'templates/',
- templateFooter: TEMPLATE_FOOTER
+ root: 'templates/'
}))
.pipe(gulp.dest(options.tmp));
});
@@ -66,7 +98,6 @@
// remove dev dependencies from html
.pipe(replace(/<!-- bower:css -->(\n.*)*\n<!-- endbower --><!-- endcss -->/, ''))
.pipe(replace(/<!-- bower:js -->(\n.*)*\n<!-- endbower --><!-- endjs -->/, ''))
- .pipe(replace(/ng-app=".*"\s/, ''))
// injecting minified files
.pipe(
inject(
@@ -112,6 +143,7 @@
'babel',
'scripts',
'wiredep',
+ 'injectCss',
'copyHtml',
'cleanTmp'
);
diff --git a/views/ngXosLib/generator-xos/app/templates/gulp/server.js b/views/ngXosLib/generator-xos/app/templates/gulp/server.js
index 7605294..1c8a0a7 100644
--- a/views/ngXosLib/generator-xos/app/templates/gulp/server.js
+++ b/views/ngXosLib/generator-xos/app/templates/gulp/server.js
@@ -9,6 +9,7 @@
var wiredep = require('wiredep').stream;
var httpProxy = require('http-proxy');
var del = require('del');
+var sass = require('gulp-sass');
const environment = process.env.NODE_ENV;
@@ -78,6 +79,19 @@
gulp.watch(options.src + '**/*.html', function(){
browserSync.reload();
});
+ gulp.watch(options.css + '**/*.css', function(){
+ browserSync.reload();
+ });
+ gulp.watch(`${options.sass}/**/*.scss`, ['sass'], function(){
+ browserSync.reload();
+ });
+ });
+
+ // compile sass
+ gulp.task('sass', function () {
+ return gulp.src(`${options.sass}/**/*.scss`)
+ .pipe(sass().on('error', sass.logError))
+ .pipe(gulp.dest(options.css));
});
// transpile js with sourceMaps
@@ -137,6 +151,7 @@
gulp.task('serve', function() {
runSequence(
+ 'sass',
'bower',
'injectScript',
'injectCss',
diff --git a/views/ngXosLib/generator-xos/app/templates/gulpfile.js b/views/ngXosLib/generator-xos/app/templates/gulpfile.js
index b2cdab8..8d30660 100644
--- a/views/ngXosLib/generator-xos/app/templates/gulpfile.js
+++ b/views/ngXosLib/generator-xos/app/templates/gulpfile.js
@@ -5,6 +5,8 @@
var options = {
src: 'src/',
+ css: 'src/css/',
+ sass: 'src/sass/',
scripts: 'src/js/',
tmp: 'src/.tmp',
dist: 'dist/',
diff --git a/views/ngXosLib/generator-xos/app/templates/package.json b/views/ngXosLib/generator-xos/app/templates/package.json
index 7a842fe..7c0a016 100644
--- a/views/ngXosLib/generator-xos/app/templates/package.json
+++ b/views/ngXosLib/generator-xos/app/templates/package.json
@@ -30,6 +30,7 @@
"gulp-minify-html": "^1.0.4",
"gulp-rename": "^1.2.2",
"gulp-replace": "^0.5.4",
+ "gulp-sass": "^2.2.0",
"gulp-uglify": "^1.4.2",
"http-proxy": "^1.12.0",
"proxy-middleware": "^0.15.0",
diff --git a/views/ngXosLib/generator-xos/app/templates/src/sass/main.scss b/views/ngXosLib/generator-xos/app/templates/src/sass/main.scss
new file mode 100644
index 0000000..3d8a1c1
--- /dev/null
+++ b/views/ngXosLib/generator-xos/app/templates/src/sass/main.scss
@@ -0,0 +1,3 @@
+#xos<%=fileName%> {
+
+}
\ No newline at end of file
diff --git a/views/ngXosLib/xosHelpers/src/ui_components/table/table.component.js b/views/ngXosLib/xosHelpers/src/ui_components/table/table.component.js
index e384c98..faeaa26 100644
--- a/views/ngXosLib/xosHelpers/src/ui_components/table/table.component.js
+++ b/views/ngXosLib/xosHelpers/src/ui_components/table/table.component.js
@@ -17,21 +17,21 @@
data: '=',
columns: '='
},
- template: `
- <!--<pre>{{vm.data | json}}</pre>-->
- <table class="table table-striped" ng-show="vm.data.length > 0">
- <thead>
- <tr>
- <th ng-repeat="col in vm.columns">{{col}}</th>
- </tr>
- </thead>
- <tbody>
- <tr ng-repeat="item in vm.data">
- <td ng-repeat="col in vm.columns">{{item[col]}}</td>
- </tr>
- </tbody>
- </table>
- `,
+ template: [
+ '<!--<pre>{{vm.data | json}}</pre>-->',
+ '<table class="table table-striped" ng-show="vm.data.length > 0">',
+ '<thead>',
+ '<tr>',
+ '<th ng-repeat="col in vm.columns">{{col}}</th>',
+ '</tr>',
+ '</thead>',
+ '<tbody>',
+ '<tr ng-repeat="item in vm.data">',
+ '<td ng-repeat="col in vm.columns">{{item[col]}}</td>',
+ '</tr>',
+ '</tbody>',
+ '</table>'
+ ].join(),
bindToController: true,
controllerAs: 'vm',
controller: function(){
diff --git a/views/ngXosViews/diagnostic/gulp/build.js b/views/ngXosViews/diagnostic/gulp/build.js
index 3853943..c9cd9cb 100644
--- a/views/ngXosViews/diagnostic/gulp/build.js
+++ b/views/ngXosViews/diagnostic/gulp/build.js
@@ -26,7 +26,6 @@
var autoprefixer = require('autoprefixer');
var mqpacker = require('css-mqpacker');
var csswring = require('csswring');
-var sass = require('gulp-sass');
module.exports = function(options){