Adds 'production' command line argument for gulp and make (Bug 1507811) (899bd43f) · Commits · mahara / mahara

Makefile

+2 −1

Original line number	Diff line number	Diff line
		all: css

		production = true
		css:
		ifeq (, $(shell which npm))
		$(error ERROR: Can't find the "npm" executable. Try "sudo apt-get install npm")
		@@ -14,7 +15,7 @@ ifndef npmsetup
		npm install
		endif
		@echo "Building CSS..."
		@if gulp css ; then echo "Done!"; else npm install; gulp css; fi
		@if gulp css --production $(production) ; then echo "Done!"; else npm install; gulp css --production $(production); fi

		clean-css:
		find ./htdocs/theme/* -maxdepth 1 -name "style" -type d -exec rm -Rf {} \;

+8 −3

Original line number	Diff line number	Diff line
		@@ -12,6 +12,8 @@ var autoprefixer = require('gulp-autoprefixer');
		var bless = require('gulp-bless');
		var es = require('event-stream');
		var globule = require('globule');
		var argv = require('yargs').default('production', 'true').argv;
		var gulpif = require('gulp-if');

		// Locate all the themes (they're the directories with a "themeconfig.php" in them)
		var themes = globule.find('htdocs/theme/*/themeconfig.php');
		@@ -26,13 +28,16 @@ gulp.task('css', 'Compile SASS into CSS', function () {

		console.log("Compiling CSS for " + themepath);
		return gulp.src('sass/*/.scss', {cwd: themepath})
		.pipe(sass().on('error', sass.logError))
		.pipe(gulpif(argv.production !== 'false', sass().on('error', sass.logError), sass({
		style: 'expanded',
		sourceComments: 'normal'
		}).on('error', sass.logError)))
		.pipe(autoprefixer({
		browsers: ['last 4 version'],
		cascade: false
		}))
		.pipe(minifyCSS())
		.pipe(bless())
		.pipe(gulpif(argv.production !== 'false', minifyCSS()))
		.pipe(gulpif(argv.production !== 'false', bless()))
		.pipe(gulp.dest('style/', {cwd: themepath}));
		});

+16 −0

Original line number	Diff line number	Diff line
		@@ -149,6 +149,22 @@ Now that Gulp is set up, __every time you want to work on a theme__, you will ne

		This will watch all the `.scss` files in every theme folder for changes and recompile your `.css`.

		gulp --production false

		This will compile the css with debug comments in place.

		#### Using Make to work on themes

		Other useful commands are `make css` and `make css production=false` that can be run from the site's root directory.

		make css

		This will compile all the different theme css at once into the most compressed format for each theme.

		make css production=false

		This will compile all the different theme css at once but uncompressed and will add debug comments in place to make understanding of sass -> css workflow better.

		### Folder structure of the `raw` theme

		The `raw` theme's Sass has been split into partials based on the purpose they serve in the theme. A partial is a Sass file named with a leading underscore, e.g. `_partial.scss`. The underscore lets Sass know that the file is only a partial file and that it should not be generated into a CSS file. Sass partials are used with the `@import` directive.

+3 −1