diff --git a/config/commands/build.yml b/config/commands/build.yml index 35c26ab7a..c51377c0f 100644 --- a/config/commands/build.yml +++ b/config/commands/build.yml @@ -13,3 +13,4 @@ command: build-npm-packages: ${toolkit.build.npm.packages} theme-task-runner: ${toolkit.build.npm.theme-task-runner} ecl-command: ${toolkit.build.npm.ecl-command} + bcl-command: ${toolkit.build.npm.bcl-command} diff --git a/config/runner/toolkit.yml b/config/runner/toolkit.yml index c0e12a355..4f057c32e 100644 --- a/config/runner/toolkit.yml +++ b/config/runner/toolkit.yml @@ -109,7 +109,7 @@ toolkit: custom-code-folder: 'lib' npm: theme-task-runner: ecl-builder - packages: '@ecl/builder @ecl/preset-ec @ecl/preset-eu @ecl/preset-reset' + packages: '@ecl/builder @ecl/preset-ec @ecl/preset-eu @ecl/preset-reset @openeuropa/bcl-builder @openeuropa/bcl-bootstrap @openeuropa/bcl-theme-default' ecl-command: 'styles scripts' scss: validate: 'false' diff --git a/docs/guide/building-assets.rst b/docs/guide/building-assets.rst index 5c44c1c40..712f4f7dc 100644 --- a/docs/guide/building-assets.rst +++ b/docs/guide/building-assets.rst @@ -28,8 +28,8 @@ like shown below: toolkit: build: npm: - theme-task-runner: ecl-builder gulp - packages: '@ecl/builder pikaday moment gulp gulp-concat gulp-sass gulp-clean-css gulp-minify' + theme-task-runner: ecl-builder gulp bcl-builder + packages: '@ecl/builder pikaday moment gulp gulp-concat gulp-sass gulp-clean-css gulp-minify @openeuropa/bcl-builder @openeuropa/bcl-bootstrap @openeuropa/bcl-theme-default' ecl-command: 'styles scripts' Command to run: @@ -41,7 +41,7 @@ Command to run: Edit the config file in order to fit your needs ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ -('ecl-builder.config.js' and/or 'gulpfile.js') +('ecl-builder.config.js', 'bcl-builder.config.js' and/or 'gulpfile.js') ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Depending on the chosen runners a config file will be created on the theme root folder. @@ -68,6 +68,19 @@ To use other command listed on 'ecl-builder' options an additional parameter can // Execute an available command from the ecl-builder list - Get help: docker-compose exec web ./vendor/bin/run toolkit:build-assets --ecl-command=help +Build theme assets (bcl-builder) +^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + +Toolkit compiles the Css and Js files, defined in the configuration file +'bcl-builder.config.js' as entry and destination paths. +The bcl-builder command used for this action is 'styles'. This the default command. + +To use other command listed on 'bcl-builder' options an additional parameter can be provided: +'--bcl-command' +.. code-block:: + + // Execute an available command from the bcl-builder list - Get help: + docker-compose exec web ./vendor/bin/run toolkit:build-assets --bcl-command=help Define 'default-theme' ^^^^^^^^^^^^^^^^^^^ diff --git a/resources/assets/bcl-builder.config.js b/resources/assets/bcl-builder.config.js new file mode 100644 index 000000000..e5585bdbe --- /dev/null +++ b/resources/assets/bcl-builder.config.js @@ -0,0 +1,38 @@ +const path = require('path'); +const pkg = require('./package.json'); + +const isProd = process.env.NODE_ENV === 'production'; +const outputFolder = path.resolve(__dirname); +const nodeModules = path.resolve(__dirname, "./node_modules"); + +// SCSS includePaths +const includePaths = [nodeModules]; + +const banner = `${pkg.name} - ${ + pkg.version +} Built on ${new Date().toISOString()}`; + +module.exports = { + scripts: [], + styles: [ + { + entry: path.resolve(__dirname, 'sass/style.scss'), + dest: path.resolve(outputFolder, 'css/style.min.css'), + options: { + includePaths, + minify: true, + sourceMap: isProd ? 'file' : true, + }, + }, + { + entry: path.resolve(__dirname, 'sass/style.scss'), + dest: path.resolve(outputFolder, 'css/style.min.css'), + options: { + includePaths, + minify: true, + sourceMap: isProd ? 'file' : true, + }, + }, + ], + copy: [] +}; diff --git a/tests/fixtures/commands/build.yml b/tests/fixtures/commands/build.yml index 86db11684..d4752fd81 100644 --- a/tests/fixtures/commands/build.yml +++ b/tests/fixtures/commands/build.yml @@ -181,9 +181,19 @@ ->exec('npm list @ecl/preset-ec || npm install @ecl/preset-ec --save-dev') ->exec('npm list @ecl/preset-eu || npm install @ecl/preset-eu --save-dev') ->exec('npm list @ecl/preset-reset || npm install @ecl/preset-reset --save-dev') + ->exec('cp /test/toolkit/resources/assets/bcl-builder.config.j ... l-builder.config.js') + ->exec('npm list @openeuropa/bcl-builder || npm install @openeuropa/bcl-builder --save') + ->exec('npm list @openeuropa/bcl-bootstrap || npm install @openeuropa/bcl-bootstrap --save') + ->exec('npm list @openeuropa/bcl-theme-default|| npm install @openeuropa/bcl-theme-default --save') [Simulator] Simulating Exec('./node_modules/.bin/ecl-builder styles') ->dir('/test/toolkit/tests/sandbox/BuildCommandsTest/code/theme') [Simulator] Running ./node_modules/.bin/ecl-builder styles in /test/toolkit/tests/sandbox/BuildCommandsTest/code/theme [Simulator] Simulating Exec('./node_modules/.bin/ecl-builder scripts') ->dir('/test/toolkit/tests/sandbox/BuildCommandsTest/code/theme') [Simulator] Running ./node_modules/.bin/ecl-builder scripts in /test/toolkit/tests/sandbox/BuildCommandsTest/code/theme + [Simulator] Simulating Exec('./node_modules/.bin/bcl-builder styles') + ->dir('/test/toolkit/tests/sandbox/BuildCommandsTest/code/theme') + [Simulator] Running ./node_modules/.bin/bcl-builder styles in /test/toolkit/tests/sandbox/BuildCommandsTest/code/theme + [Simulator] Simulating Exec('./node_modules/.bin/bcl-builder scripts') + ->dir('/test/toolkit/tests/sandbox/BuildCommandsTest/code/theme') + [Simulator] Running ./node_modules/.bin/bcl-builder scripts in /test/toolkit/tests/sandbox/BuildCommandsTest/code/theme