Skip to content

Commit

Permalink
Merge 85ff439 into 2824a52
Browse files Browse the repository at this point in the history
  • Loading branch information
@dbeerten
dbeerten committed Nov 13, 2020
2 parents 2824a52 + 85ff439 commit 4095714
Show file tree
Hide file tree
Showing 88 changed files with 5,552 additions and 2,394 deletions.
6 changes: 4 additions & 2 deletions .eslintrc
View file
Expand Up @@ -2,13 +2,15 @@
"root": true,
"env": {
"browser": true,
"es6": true
"es6": true,
"jquery": true
},
"globals": {
"dataLayer": "readonly"
},
"extends": ["./node_modules/@kunstmaan/eslint-config/index.js"],
"rules": {
"import/no-extraneous-dependencies": ["error", {"devDependencies": ["gulpfile.babel.js", "./groundcontrol/**/*.js"]}]
}
},
"ignorePatterns": ["**/AdminBundle/Resources/ui/js/*.js"]
}
5 changes: 4 additions & 1 deletion .stylelintrc
View file
@@ -1,5 +1,8 @@
{
"extends": ["./node_modules/@kunstmaan/stylelint-config/index.js"],
"rules": {
}
},
"ignoreFiles": [
"**/*.js"
]
}
2 changes: 2 additions & 0 deletions docs/cookbook/defining-custom-ckeditor-configuration.md
View file
@@ -1,5 +1,7 @@
# Defining custom CKEditor configurations

TODO: UPDATE DOC FOR CKEDITOR5

Sometimes you want to limit or extend the possibilities of your rich text editor fields used in the Kunstmaan bundles admin.
You can do so by following 3 easy steps.

Expand Down
174 changes: 132 additions & 42 deletions groundcontrol/admin-bundle.tasks.js
View file
@@ -1,48 +1,65 @@
/* eslint-env node */

import gulp from 'gulp';
import webpack from 'webpack';
import path from 'path';
import CKEditorWebpackPlugin from '@ckeditor/ckeditor5-dev-webpack-plugin';
import { styles } from '@ckeditor/ckeditor5-dev-utils';
import TerserPlugin from 'terser-webpack-plugin';

import consoleArguments from './console-arguments';

import createEslintTask from './tasks/eslint';
import createStylelintTask from './tasks/stylelint';
import createCopyTask from './tasks/copy';
import {createCssLocalTask, createCssOptimizedTask} from './tasks/css';
import { createCssLocalTask, createCssOptimizedTask } from './tasks/css';
import createScriptsTask from './tasks/scripts';
import createBundleTask, {getBabelLoaderOptions} from './tasks/bundle';
import createBundleTask, { getBabelLoaderOptions } from './tasks/bundle';

export const adminBundle = {
config: {
srcPath: './src/Kunstmaan/AdminBundle/Resources/ui/',
distPath: './src/Kunstmaan/AdminBundle/Resources/public/',
publicPath: '/bundles/kunstmaanadmin'
publicPath: '/bundles/kunstmaanadmin',
},
tasks: {}
tasks: {},
};

adminBundle.tasks.eslint = createEslintTask({
src: `${adminBundle.config.srcPath}jsnext/**/*.js`,
failAfterError: !consoleArguments.continueAfterTestError
failAfterError: !consoleArguments.continueAfterTestError,
});

adminBundle.tasks.stylelint = createStylelintTask({
src: `${adminBundle.config.srcPath}scssnext/**/*.scss`,
});

adminBundle.tasks.copy = gulp.parallel(
createCopyTask({src: [`${adminBundle.config.srcPath}img/**`], dest: `${adminBundle.config.distPath}img`}),
createCopyTask({src: [`${adminBundle.config.srcPath}icons/**`], dest: `${adminBundle.config.distPath}icons`})
createCopyTask({
src: [`${adminBundle.config.srcPath}img/**`],
dest: `${adminBundle.config.distPath}img`,
}),
createCopyTask({
src: [`${adminBundle.config.srcPath}icons/**`],
dest: `${adminBundle.config.distPath}icons`,
}),
);

adminBundle.tasks.cssLocal = createCssLocalTask({src: `${adminBundle.config.srcPath}scss/*.scss`, dest: `${adminBundle.config.distPath}css`});
adminBundle.tasks.cssNextLocal = createCssLocalTask({src: `${adminBundle.config.srcPath}scssnext/*.scss`, dest: `${adminBundle.config.distPath}cssnext`});


adminBundle.tasks.cssLocal = createCssLocalTask({
src: `${adminBundle.config.srcPath}scss/*.scss`,
dest: `${adminBundle.config.distPath}css`,
});
adminBundle.tasks.cssNextLocal = createCssLocalTask({
src: `${adminBundle.config.srcPath}scssnext/*.scss`,
dest: `${adminBundle.config.distPath}cssnext`,
});

adminBundle.tasks.cssOptimized = createCssOptimizedTask({src: `${adminBundle.config.srcPath}scss/*.scss`, dest: `${adminBundle.config.distPath}css`});
adminBundle.tasks.cssNextOptimized = createCssOptimizedTask({src: `${adminBundle.config.srcPath}scssnext/*.scss`, dest: `${adminBundle.config.distPath}cssnext`});
adminBundle.tasks.cssOptimized = createCssOptimizedTask({
src: `${adminBundle.config.srcPath}scss/*.scss`,
dest: `${adminBundle.config.distPath}css`,
});
adminBundle.tasks.cssNextOptimized = createCssOptimizedTask({
src: `${adminBundle.config.srcPath}scssnext/*.scss`,
dest: `${adminBundle.config.distPath}cssnext`,
});

adminBundle.tasks.scripts = createScriptsTask({
src: [
Expand All @@ -58,20 +75,19 @@ adminBundle.tasks.scripts = createScriptsTask({
'./node_modules/sortablejs/Sortable.js',
'./node_modules/bootstrap-colorpicker/dist/js/bootstrap-colorpicker.js',
'./node_modules/jquery.typewatch/jquery.typewatch.js',
'./node_modules/ckeditor/ckeditor.js',
'./node_modules/ckeditor/adapters/jquery.js',
`${adminBundle.config.srcPath}js/**/*.js`
`${adminBundle.config.srcPath}js/**/*.js`,
],
dest: `${adminBundle.config.distPath}js`,
filename: 'admin-bundle.min.js'
filename: 'admin-bundle.min.js',
uglifyJs: !consoleArguments.speedupLocalDevelopment,
});

adminBundle.tasks.bundle = createBundleTask({
config: {
entry: `${adminBundle.config.srcPath}jsnext/app.js`,
output: {
filename: 'admin-bundle.next.js',
path: path.resolve(__dirname, `.${adminBundle.config.distPath}js`)
path: path.resolve(__dirname, `.${adminBundle.config.distPath}js`),
},
devtool: 'cheap-module-source-map',
mode: 'development',
Expand All @@ -84,23 +100,60 @@ adminBundle.tasks.bundle = createBundleTask({
query: getBabelLoaderOptions({
transpileOnlyForLastChromes: consoleArguments.speedupLocalDevelopment
})
}
]
}
}
},
{
test: /ckeditor5-[^/\\]+[/\\]theme[/\\]icons[/\\][^/\\]+\.svg$/,
use: ['raw-loader'],
},
{
test: /ckeditor5-[^/\\]+[/\\]theme[/\\].+\.css$/,
use: [
{
loader: 'style-loader',
options: {
injectType: 'singletonStyleTag',
attributes: {
'data-cke': true,
},
},
},
{
loader: 'postcss-loader',
options: styles.getPostCssConfig({
themeImporter: {
themePath: require.resolve('@ckeditor/ckeditor5-theme-lark'),
},
sourceMap: true,
}),
},
],
},
],
},
plugins: [
new CKEditorWebpackPlugin({
language: 'en',
additionalLanguages: 'all',
outputDirectory: 'cke-translations',
}),
],
},
});

adminBundle.tasks.bundleOptimized = createBundleTask({
config: {
entry: `${adminBundle.config.srcPath}jsnext/app.js`,
output: {
filename: 'admin-bundle.next.js',
path: path.resolve(__dirname, `.${adminBundle.config.distPath}js`)
path: path.resolve(__dirname, `.${adminBundle.config.distPath}js`),

},
devtool: 'source-map',
optimization: {
minimize: true
minimize: true,
minimizer: [new TerserPlugin({
sourceMap: false,
extractComments: false,
})],
},
mode: 'production',
module: {
Expand All @@ -110,25 +163,62 @@ adminBundle.tasks.bundleOptimized = createBundleTask({
exclude: /node_modules/,
loader: 'babel-loader',
query: getBabelLoaderOptions({
optimize: true
})
}
]
}
transpileOnlyForLastChromes: consoleArguments.speedupLocalDevelopment,
}),
},
{
test: /ckeditor5-[^/\\]+[/\\]theme[/\\]icons[/\\][^/\\]+\.svg$/,
use: ['raw-loader'],
},
{
test: /ckeditor5-[^/\\]+[/\\]theme[/\\].+\.css$/,
use: [
{
loader: 'style-loader',
options: {
injectType: 'singletonStyleTag',
attributes: {
'data-cke': true,
},
},
},
{
loader: 'postcss-loader',
options: styles.getPostCssConfig({
themeImporter: {
themePath: require.resolve('@ckeditor/ckeditor5-theme-lark'),
},
minify: true,
}),
},
],
},
],
},
plugins: [
new CKEditorWebpackPlugin({
language: 'en',
additionalLanguages: 'all',
outputDirectory: 'cke-translations',
}),
],
},
logStats: true
logStats: true,
});

adminBundle.tasks.bundlePolyfills = createBundleTask({
config: {
entry: ['babel-polyfill', `${adminBundle.config.srcPath}jsnext/polyfills.js`],
output: {
filename: 'admin-bundle-polyfills.js',
path: path.resolve(__dirname, `.${adminBundle.config.distPath}js`)
path: path.resolve(__dirname, `.${adminBundle.config.distPath}js`),
},
devtool: 'source-map',
optimization: {
minimize: true
minimize: true,
minimizer: [new TerserPlugin({
sourceMap: false,
extractComments: false,
})],
},
mode: 'production',
module: {
Expand All @@ -138,11 +228,11 @@ adminBundle.tasks.bundlePolyfills = createBundleTask({
exclude: /node_modules/,
loader: 'babel-loader',
query: getBabelLoaderOptions({
optimize: true
})
}
]
}
optimize: true,
}),
},
],
},
},
logStats: true
logStats: true,
});
18 changes: 10 additions & 8 deletions groundcontrol/tasks/bundle.js
View file
@@ -1,18 +1,16 @@
import webpack from 'webpack';

/**
* You can let webpack watch the files and rebundle on change, or you can do it
* via gulp. Gulp will probably be easier at first, since you have to configure
* multiple watches for the other src files as well.
*/
export default function createBundleTask({config = undefined, watch = false, logStats = false}) {
export default function createBundleTask({config = undefined, logStats = false}) {
const compiler = webpack(config);
const devMode = config.mode === 'development';

return function bundle(done) {
if (watch) {
compiler.watch({}, handleWebpackResult);
} else {
compiler.run(handleWebpackResult);
}
compiler.run(handleWebpackResult);

function handleWebpackResult(err, stats) {
if (err) {
Expand All @@ -26,11 +24,15 @@ export default function createBundleTask({config = undefined, watch = false, log
const info = stats.toJson();

if (stats.hasErrors()) {
console.error(info.errors);
if (devMode) {
console.error('\x1b[31m%s\x1b[0m: ', info.errors.toString());
} else {
throw Error(info.errors.toString());
}
}

if (stats.hasWarnings()) {
console.warn(info.warnings);
console.warn(info.warnings.toString());
}

if (logStats) {
Expand Down
23 changes: 16 additions & 7 deletions groundcontrol/tasks/scripts.js
View file
Expand Up @@ -2,21 +2,30 @@ import gulp from 'gulp';
import uglify from 'gulp-uglify';
import concat from 'gulp-concat';
import debug from 'gulp-debug';
import { noop } from 'gulp-util';

/**
* Temporary scripts task.
* This should be replaced by webpack to bundle the files
*/

export default function createScriptsTask({ src = undefined, dest = undefined, filename = undefined }) {
export default function createScriptsTask({
src = undefined,
dest = undefined,
filename = undefined,
uglifyJs = true,
}) {
return function scriptsLocal() {
return gulp.src(src)
return gulp
.src(src)
.pipe(debug({ title: 'Building' }))
.pipe(uglify({
mangle: {
except: ['jQuery']
}
}))
.pipe(uglifyJs
? uglify({
mangle: {
except: ['jQuery'],
},
})
: noop())
.pipe(concat(filename))
.pipe(gulp.dest(dest));
};
Expand Down

0 comments on commit 4095714

Please sign in to comment.