build-wp-block #1

Merged
roman merged 10 commits from build-wp-block into master 2022-11-04 09:49:37 +00:00
3 changed files with 101 additions and 25 deletions
Showing only changes of commit 73be6c050b - Show all commits
+62 -15
View File
@@ -28,6 +28,7 @@
"mem-fs-editor": "^9.5.0",
"node-fetch": "^3.2.10",
"open": "^8.4.0",
"plugin-error": "^2.0.0",
"sanitize-html": "^2.7.1",
"sass": "^1.50.1",
"yeoman-environment": "^3.10.0",
@@ -5497,6 +5498,20 @@
"@babel/core": "^7.0.0"
}
},
"node_modules/gulp-babel/node_modules/plugin-error": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/plugin-error/-/plugin-error-1.0.1.tgz",
"integrity": "sha512-L1zP0dk7vGweZME2i+EeakvUNqSrdiI3F91TwEoYiGrAfUXmVv6fJIq4g82PAXxNsWOp0J7ZqQy/3Szz0ajTxA==",
"dependencies": {
"ansi-colors": "^1.0.1",
"arr-diff": "^4.0.0",
"arr-union": "^3.1.0",
"extend-shallow": "^3.0.2"
},
"engines": {
"node": ">= 0.10"
}
},
"node_modules/gulp-cli": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/gulp-cli/-/gulp-cli-2.3.0.tgz",
@@ -5717,6 +5732,20 @@
"node": ">=12"
}
},
"node_modules/gulp-sass/node_modules/plugin-error": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/plugin-error/-/plugin-error-1.0.1.tgz",
"integrity": "sha512-L1zP0dk7vGweZME2i+EeakvUNqSrdiI3F91TwEoYiGrAfUXmVv6fJIq4g82PAXxNsWOp0J7ZqQy/3Szz0ajTxA==",
"dependencies": {
"ansi-colors": "^1.0.1",
"arr-diff": "^4.0.0",
"arr-union": "^3.1.0",
"extend-shallow": "^3.0.2"
},
"engines": {
"node": ">= 0.10"
}
},
"node_modules/gulp-sass/node_modules/replace-ext": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-2.0.0.tgz",
@@ -9400,17 +9429,14 @@
}
},
"node_modules/plugin-error": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/plugin-error/-/plugin-error-1.0.1.tgz",
"integrity": "sha512-L1zP0dk7vGweZME2i+EeakvUNqSrdiI3F91TwEoYiGrAfUXmVv6fJIq4g82PAXxNsWOp0J7ZqQy/3Szz0ajTxA==",
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/plugin-error/-/plugin-error-2.0.0.tgz",
"integrity": "sha512-o4bwIOmuFwUg2MU6xt7plGEQY3YyENx6kvwaFZBrUpamA91FdS9w3U+pU0y4OuDoBQe+jf3RLGSfQebSRBEVsQ==",
"dependencies": {
"ansi-colors": "^1.0.1",
"arr-diff": "^4.0.0",
"arr-union": "^3.1.0",
"extend-shallow": "^3.0.2"
"ansi-colors": "^1.0.1"
},
"engines": {
"node": ">= 0.10"
"node": ">=10.13.0"
}
},
"node_modules/portscanner": {
@@ -16952,6 +16978,19 @@
"replace-ext": "^1.0.0",
"through2": "^2.0.0",
"vinyl-sourcemaps-apply": "^0.2.0"
},
"dependencies": {
"plugin-error": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/plugin-error/-/plugin-error-1.0.1.tgz",
"integrity": "sha512-L1zP0dk7vGweZME2i+EeakvUNqSrdiI3F91TwEoYiGrAfUXmVv6fJIq4g82PAXxNsWOp0J7ZqQy/3Szz0ajTxA==",
"requires": {
"ansi-colors": "^1.0.1",
"arr-diff": "^4.0.0",
"arr-union": "^3.1.0",
"extend-shallow": "^3.0.2"
}
}
}
},
"gulp-cli": {
@@ -17134,6 +17173,17 @@
"vinyl-sourcemaps-apply": "^0.2.1"
},
"dependencies": {
"plugin-error": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/plugin-error/-/plugin-error-1.0.1.tgz",
"integrity": "sha512-L1zP0dk7vGweZME2i+EeakvUNqSrdiI3F91TwEoYiGrAfUXmVv6fJIq4g82PAXxNsWOp0J7ZqQy/3Szz0ajTxA==",
"requires": {
"ansi-colors": "^1.0.1",
"arr-diff": "^4.0.0",
"arr-union": "^3.1.0",
"extend-shallow": "^3.0.2"
}
},
"replace-ext": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/replace-ext/-/replace-ext-2.0.0.tgz",
@@ -19905,14 +19955,11 @@
}
},
"plugin-error": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/plugin-error/-/plugin-error-1.0.1.tgz",
"integrity": "sha512-L1zP0dk7vGweZME2i+EeakvUNqSrdiI3F91TwEoYiGrAfUXmVv6fJIq4g82PAXxNsWOp0J7ZqQy/3Szz0ajTxA==",
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/plugin-error/-/plugin-error-2.0.0.tgz",
"integrity": "sha512-o4bwIOmuFwUg2MU6xt7plGEQY3YyENx6kvwaFZBrUpamA91FdS9w3U+pU0y4OuDoBQe+jf3RLGSfQebSRBEVsQ==",
"requires": {
"ansi-colors": "^1.0.1",
"arr-diff": "^4.0.0",
"arr-union": "^3.1.0",
"extend-shallow": "^3.0.2"
"ansi-colors": "^1.0.1"
}
},
"portscanner": {
+1
View File
@@ -36,6 +36,7 @@
"mem-fs-editor": "^9.5.0",
"node-fetch": "^3.2.10",
"open": "^8.4.0",
"plugin-error": "^2.0.0",
"sanitize-html": "^2.7.1",
"sass": "^1.50.1",
"yeoman-environment": "^3.10.0",
+38 -10
View File
@@ -21,6 +21,7 @@ import sanitizeHtml from 'sanitize-html';
import {escape} from "lodash-es";
import archiver from 'archiver';
import {getBlockConfigs, getConfigs, readJSONFile} from "./helpers.js";
import PluginError from 'plugin-error';
/**
* Constants
@@ -28,10 +29,6 @@ import {getBlockConfigs, getConfigs, readJSONFile} from "./helpers.js";
const {isDev, modulesPath, projectPath, developmentBlockName} = getConfigs();
const blocksRegistry = isDev ? 'http://localhost:3020' : 'https://axe-web-blocks-registry.captain.devdevdev.life';
const sass = gulpSass(dartSass);
buildStyleFiles()
buildScriptFiles()
/**
* Init server
@@ -41,6 +38,7 @@ let port = 3000; // This variable is used in `*.hbs` and it will be updated once
let previewFrameUrl = `http://localhost:${port}`; // This variable is used in `*.hbs` and it will be updated once BrowserSync is ready.
const dataFiles = prepareListOfDataFiles(await fs.readdir(path.join(projectPath, 'data')));
const app = express();
const sass = gulpSass(dartSass);
const hbs = create({
extname: '.hbs', defaultLayout: false, partialsDir: ['.'], helpers: {
@@ -173,6 +171,9 @@ app.use(express.static(path.join(projectPath, 'src')));
app.use(express.static(path.join(projectPath, 'design')));
app.use(express.static(path.join(modulesPath, 'layouts')));
// Setup Gulp
await buildAssetFiles();
// BrowserSync
const bsOptions = await startBrowserSync();
port = bsOptions.port;
@@ -212,12 +213,12 @@ function startBrowserSync() {
const bs = browserSync.create();
const files = getJSBundleFiles();
gulp.watch(files, {delay: 400}, gulp.series([buildScriptFiles, function (cb) {
gulp.watch(files, {delay: 400}, gulp.series(['build-script-files', function (cb) {
browserSyncReload(bs, 'js', 'Script Files Change');
return cb();
}]));
gulp.watch(path.join(projectPath, 'src/**/*.scss'), {delay: 400}, gulp.series([buildStyleFiles, function (cb) {
gulp.watch(path.join(projectPath, 'src/**/*.scss'), {delay: 400}, gulp.series(['build-styling-files', function (cb) {
browserSyncReload(bs, 'css', 'Style Files Change');
return cb();
}]));
@@ -263,11 +264,14 @@ function getJSBundleFiles() {
return [path.join(projectPath, 'src/**/*.js'), path.join(projectPath, 'src/**/*.mjs'), '!' + path.join(projectPath, 'src/**/*.min.js')];
}
function buildScriptFiles() {
function buildScriptFiles(done) {
const files = getJSBundleFiles();
return gulp.src(files)
.pipe(sourcemaps.init({}))
.pipe(babel())
.pipe(babel()).on('error', function (error) {
showError(new PluginError('JavaScript', error).toString());
done();
})
.pipe(gulp.src(path.join(projectPath, 'vendor/*.js')))
// .pipe(gulp.dest('src/'))
.pipe(uglify())
@@ -276,16 +280,40 @@ function buildScriptFiles() {
.pipe(gulp.dest(path.join(projectPath, 'src/')));
}
function buildStyleFiles() {
function buildStyleFiles(done) {
return gulp.src(path.join(projectPath, 'src/**/*.scss'))
.pipe(sourcemaps.init({}))
.pipe(sass.sync({outputStyle: 'compressed'}).on('error', sass.logError))
.pipe(sass.sync({outputStyle: 'compressed'}).on('error', function (error) {
showError(new PluginError('SCSS', error.messageFormatted).toString());
// sass.logError(error);
done();
}))
// .pipe(gulp.dest('src/'))
.pipe(rename({extname: '.min.css'}))
.pipe(sourcemaps.write('.', {}))
.pipe(gulp.dest(path.join(projectPath, 'src')))
}
function buildAssetFiles() {
// Register tasks.
gulp.task('build-script-files', buildScriptFiles);
gulp.task('build-styling-files', buildStyleFiles);
// Run first build.
return new Promise((resolve) => {
gulp.series('build-script-files', 'build-styling-files', function (cb) {
resolve();
})();
});
}
function showError(errorMessage) {
console.log(errorMessage);
// TODO: Send this message to browser.
// So the developer can understand there is an error.
}
function prepareListOfDataFiles(dataFiles) {
return dataFiles
.filter((fileName) => fileName.split('.').pop() === 'json')