wp-blank-scripts 3.1.18 → 4.0.0-alpha.0

package/cli/migrate-sass.js

@@ -0,0 +1,86 @@
+const { execSync } = require('child_process');
+const path = require('path');
+
+const logger = require('../logger');
+const getProjectPath = require('../utils/getProjectPath');
+
+// Migrations in recommended order. Division must run before module because
+// the module migrator rewrites files and division patterns are easier to
+// detect in the original @import-based code.
+const MIGRATIONS = ['division', 'color', 'module'];
+
+const MIGRATION_NOTES = {
+  division: 'Replaces `/` division with `math.div()` and adds `@use "sass:math"` where needed.',
+  color:
+    'Replaces deprecated color functions (darken, lighten, mix, etc.) with color.adjust()/color.scale().',
+  module:
+    'Converts @import to @use/@forward. This is the most complex migration — review all changes carefully. ' +
+    'Variables/mixins/functions will be namespaced (e.g. variables.$var instead of $var).',
+};
+
+module.exports = async (argv) => {
+  const migration = argv.migration;
+  const scssGlob = argv.glob || 'src/**/*.scss';
+  const dryRun = argv['dry-run'];
+
+  if (migration && !MIGRATIONS.includes(migration)) {
+    logger.error(`Unknown migration "${migration}". Valid options: ${MIGRATIONS.join(', ')}`);
+    process.exit(1);
+  }
+
+  const migrationsToRun = migration ? [migration] : MIGRATIONS;
+
+  logger.log('\nSass migration tool — wraps the official sass-migrator.\n');
+
+  if (dryRun) {
+    logger.log('Dry run mode — no files will be changed.\n');
+  }
+
+  for (const m of migrationsToRun) {
+    logger.log(`→ ${m}: ${MIGRATION_NOTES[m]}\n`);
+
+    const flags = [
+      m,
+      dryRun ? '--dry-run' : '',
+      // Allow sass-migrator to resolve node_modules imports the same way webpack does
+      '--load-path=.',
+      // For the module migration, also migrate imported dependencies
+      m === 'module' ? '--migrate-deps' : '',
+      scssGlob,
+    ]
+      .filter(Boolean)
+      .join(' ');
+
+    const cmd = `npx sass-migrator ${flags}`;
+
+    logger.log(`Running: ${cmd}\n`);
+
+    try {
+      execSync(cmd, {
+        cwd: getProjectPath(),
+        stdio: 'inherit',
+      });
+      logger.success(`${m} migration complete\n`);
+    } catch (err) {
+      logger.error(`${m} migration failed — fix errors above before continuing.\n`);
+      process.exit(1);
+    }
+
+    if (m !== migrationsToRun[migrationsToRun.length - 1]) {
+      logger.log('────────────────────────────────────\n');
+    }
+  }
+
+  if (!dryRun) {
+    logger.success(
+      'All migrations complete. Run your build to verify output, then commit the changes.'
+    );
+
+    if (migrationsToRun.includes('module')) {
+      logger.log(
+        '\nNote: The module migration renames namespaces. Check any partials that were ' +
+          'imported multiple times — they may need @forward in an index file.'
+      );
+    }
+  }
+};

package/cli/setup.js

@@ -8,44 +8,38 @@ const setupProject = require('../lib/setupProject');
 const logger = require('../logger');
 const getCliOptions = require('../utils/getCliOptions');
 const getMAMPDocumentRoot = require('../utils/getMAMPDocumentRoot');
-const getDefaultSetup = require('../utils/getDefaultSetup');
 const getProjectPath = require('../utils/getProjectPath');
 const exitWithError = require('../utils/exitWithError');
 
+const AGENCY = 'ViVO Digital';
+const AGENCY_SLUG = 'vivo';
+const AGENCY_WEBSITE = 'https://vivo.digital';
+
 const documentRoot = getMAMPDocumentRoot();
-const defaultAnswers = getDefaultSetup();
 
 async function confirmOptions(options) {
-  const {
-    database,
-    project,
-    projectLocation,
-    projectSlug,
-    agency,
-    agencySlug,
-    agencyWebsite,
-    tablePrefix,
-    productionDomain,
-  } = options;
+  const { database, project, projectLocation, projectSlug, tablePrefix, productionDomain } =
+    options;
 
   const projectSettings = [
     ['Project Location', projectLocation],
     ['Project Slug', projectSlug],
     ['Project Name', project],
-    ['Agency', agency],
-    ['Agency Slug', agencySlug],
-    ['Agency Website', agencyWebsite],
     ['Database', database],
     ['Database Table Prefix', tablePrefix],
     ['Production Domain', productionDomain],
   ];
 
+  logger.log(
+    `\nProject settings:\n${projectSettings
+      .map(([title, value]) => `  ${chalk.yellow(title)}: ${value || chalk.dim('(empty)')}`)
+      .join('\n')}\n`
+  );
+
   const res = await inquirer.prompt([
     {
       name: 'confirm',
-      message: `Please confirm your project settings:\n${projectSettings
-        .map(([title, value]) => `${chalk.yellow(title)}: ${value}`)
-        .join('\n')}`,
+      message: 'Does this look correct?',
       type: 'confirm',
       default: false,
     },
@@ -66,50 +60,34 @@ async function selectOptions() {
     {
       name: 'projectSlug',
       message: 'What is the project slug (folder name)?',
-      default: path
-        .relative(documentRoot, getProjectPath())
-        .split('/')
-        .pop(),
+      default: path.relative(documentRoot, getProjectPath()).split('/').pop(),
     },
     {
       name: 'project',
       message: 'What is the project name?',
-      default: defaultAnswers.project,
     },
     {
       name: 'productionDomain',
       message: 'What is the production domain? (example.com)',
       default: '',
     },
-    {
-      name: 'agency',
-      message: "What's the name of the agency?",
-      default: defaultAnswers.agency,
-    },
-    {
-      name: 'agencySlug',
-      message: "What's the agency slug?",
-      default: defaultAnswers.agencySlug,
-    },
-    {
-      name: 'agencyWebsite',
-      message: 'Whats the agency website?',
-      default: defaultAnswers.agencyWebsite,
-    },
     {
       name: 'tablePrefix',
       message: 'Whats the database table prefix?',
-      default: answers =>
-        (answers.project || defaultAnswers.agencySlug)
+      default: (answers) =>
+        (answers.project || AGENCY_SLUG)
           .split(' ')
-          .map(a => (a[0] || '').toLowerCase())
+          .map((a) => (a[0] || '').toLowerCase())
           .join(''),
     },
   ]);
 
   options = Object.assign({}, res, {
-    // Create database name based on agency and project name
-    database: slugify(`${res.agencySlug} ${res.project}`),
+    agency: AGENCY,
+    agencySlug: AGENCY_SLUG,
+    agencyWebsite: AGENCY_WEBSITE,
+    // Create database name based on agency slug and project name
+    database: slugify(`${AGENCY_SLUG} ${res.project}`),
     // Ensure table prefix ends with an underscore
     tablePrefix:
       res.tablePrefix[res.tablePrefix.length - 1] === '_' ? res.tablePrefix : `${res.tablePrefix}_`,

package/index.js

@@ -11,6 +11,7 @@ const importSQL = require('./cli/import');
 const exportSQL = require('./cli/export');
 const pullSQL = require('./cli/pull');
 const addDeployConfig = require('./cli/config');
+const migrateSass = require('./cli/migrate-sass');
 
 const exitWithError = require('./utils/exitWithError');
 
@@ -40,15 +41,6 @@ yargs
         .options('project', {
           describe: 'The project name.',
         })
-        .options('agency', {
-          describe: 'The name of the agency.',
-        })
-        .options('agencySlug', {
-          describe: 'The slug version of the agency name.',
-        })
-        .options('agencyWebsite', {
-          describe: 'The agency website url.',
-        })
         .options('tablePrefix', {
           describe: 'The table prefix for wordpress tables.',
         }),
@@ -63,13 +55,13 @@ yargs
           describe: 'The environment to deploy to.',
         })
         .option('mode', {
-          describe: 'What should be deployed, Site, wp-content, Theme or Sql Only.',
+          describe: 'What should be deployed, Site, wp-content, Theme or SQL Only.',
         })
         .option('sql', {
           describe: "Should SQL be deployed, this is assumed true if mode is 'SQL only'.",
         })
         .option('serverPassword', {
-          describe: 'The password for the configured user on the server, if sql is true.',
+          describe: 'The password for the configured user on the server, if SQL is true.',
         })
         .option('serverPrivateKey', {
           describe: 'The path to private key efaults to ~/.ssh/id_rsa',
@@ -125,6 +117,25 @@ yargs
       }),
     hooks
   )
+  .command(
+    'migrate-sass',
+    'Migrate legacy SCSS to Dart Sass 3.0 compatible syntax',
+    (yargs) =>
+      yargs
+        .option('migration', {
+          describe: `Specific migration to run: ${['division', 'color', 'module'].join(
+            ', '
+          )}. Omit to run all in order.`,
+        })
+        .option('glob', {
+          describe: 'Glob pattern for SCSS files. Defaults to src/**/*.scss',
+        })
+        .option('dry-run', {
+          describe: 'Preview changes without writing files.',
+          type: 'boolean',
+        }),
+    migrateSass
+  )
   .command(
     'config',
     'Add deployment config',

package/lib/buildProject.js

@@ -8,6 +8,7 @@ const { rimraf } = require('rimraf');
 
 const backupProject = require('./backupProject');
 const isCI = require('../utils/isCI');
+const ensureGitignore = require('../utils/ensureGitignore');
 const isReactProject = require('../utils/isReactProject');
 const exitWithError = require('../utils/exitWithError');
 const logger = require('../logger');
@@ -54,6 +55,17 @@ module.exports = async (envConfig = {}, buildOptions, failOnError = false) => {
 
   logger.info(`Environment: ${options.environment}`);
 
+  // For non-local builds, route output to a separate directory so the dev
+  // server's dist/ is never touched. DEPLOY_OUT_DIR takes precedence (set by
+  // the deploy command), otherwise derive from environment name.
+  if (options.environment !== 'local' && !process.env.DEPLOY_OUT_DIR) {
+    process.env.DEPLOY_OUT_DIR = `dist-${options.environment}`;
+  }
+
+  if (process.env.DEPLOY_OUT_DIR) {
+    ensureGitignore('dist-*');
+  }
+
   if (!isCI() && !process.env.PORT) {
     // Only try 8 ports (BrowserSync uses 2)
     const port = await getPort({
@@ -78,7 +90,7 @@ module.exports = async (envConfig = {}, buildOptions, failOnError = false) => {
     webpackConfig = webpackConfig();
   }
 
-  rimraf('dist');
+  rimraf(process.env.DEPLOY_OUT_DIR || 'dist');
 
   const config = merge(...[baseConfig, envConfig, buildConfig, webpackConfig].filter(Boolean));
 
@@ -157,13 +169,13 @@ module.exports = async (envConfig = {}, buildOptions, failOnError = false) => {
     const info = stats.toJson();
 
     if (stats.hasWarnings()) {
-      console.log(info.warnings);
+      logger.warn(info.warnings);
       info.warnings.forEach((warning) => logger.warn(warning));
     }
 
     if (stats.hasErrors()) {
       info.errors.forEach((error) => {
-        console.log(error);
+        logger.error(error);
       });
 
       logger.error('Build finished with errors');

package/lib/deployProject.js

@@ -2,6 +2,7 @@ const fs = require('fs');
 const path = require('path');
 const mysql = require('mysql');
 const Rsync = require('rsync');
+const { rimraf } = require('rimraf');
 
 const exportSql = require('./exportSQL');
 const cleanShellPath = require('../utils/cleanShellPath');
@@ -9,11 +10,9 @@ const tunnel = require('../utils/tunnelSsh');
 const git = require('../utils/git');
 const runProjectBuildTask = require('../utils/runProjectBuildTask');
 const bumpVersion = require('../utils/bumpVersion');
-const isCI = require('../utils/isCI');
 const execAsync = require('../utils/execAsync');
 const { DEPLOY_MODES } = require('../constants');
 const getProjectPath = require('../utils/getProjectPath');
-const deploySQLFromCI = require('../utils/deploySQLFromCI');
 const getSettings = require('../utils/projectSettings');
 const logger = require('../logger');
 const replaceSQL = require('../utils/replaceSQL');
@@ -32,9 +31,9 @@ let options;
 let settings;
 let deployModeOptions;
 
-function setDeployModeOptions() {
+function setDeployModeOptions(deployBuildDir) {
   const project = settings.project;
-  const siteDirectory = settings.directories.build;
+  const siteDirectory = deployBuildDir || settings.directories.build;
 
   deployModeOptions = {
     [DEPLOY_MODES.SITE]: {
@@ -69,12 +68,6 @@ async function createTunnel() {
 
   const { tunnelHost, tunnelPort, mySQLPort } = options;
 
-  if (isCI()) {
-    execAsync(`ssh -L ${tunnelPort}:${tunnelHost}:${mySQLPort} -N ${server.user}@${server.host}`);
-    logger.log(`Created tunnel to ${server.host}`);
-    return;
-  }
-
   let serverPrivateKey;
   if (options.serverPrivateKey) {
     serverPrivateKey = fs.readFileSync(cleanShellPath(options.serverPrivateKey));
@@ -93,7 +86,7 @@ async function createTunnel() {
   };
 
   return new Promise((resolve, reject) => {
-    t = tunnel(tunnelConfig, error => {
+    t = tunnel(tunnelConfig, (error) => {
       if (error) {
         reject(new Error(`Error connecting: ${error}`));
         return;
@@ -103,7 +96,7 @@ async function createTunnel() {
       resolve();
     });
 
-    t.on('error', error => {
+    t.on('error', (error) => {
       reject(new Error(`${error}`));
     });
   });
@@ -166,7 +159,7 @@ async function deployToServer() {
     logger.log('Starting deployment');
 
     rsync.execute(
-      error => {
+      (error) => {
         if (error) {
           reject(error);
           return;
@@ -175,7 +168,7 @@ async function deployToServer() {
         logger.success(`Successfully deployed ${mode}`);
         resolve();
       },
-      data => {
+      (data) => {
         logger.log(`${data}`);
       }
     );
@@ -200,7 +193,7 @@ async function connectMySQL() {
       multipleStatements: true,
     });
 
-    m.connect(err => {
+    m.connect((err) => {
       if (err) {
         reject(err);
         return;
@@ -222,13 +215,13 @@ async function deployMySQL(file) {
     logger.log('Starting SQL deployment');
 
     const sql = fs.readFileSync(file).toString();
-    m.query(sql, error => {
+    m.query(sql, (error) => {
       if (error) {
         reject(new Error(`failed: ${error}`));
         return;
       }
 
-      logger.log('SQL deplopyment was successful');
+      logger.log('SQL deployment was successful');
       resolve();
     });
   });
@@ -236,7 +229,7 @@ async function deployMySQL(file) {
 
 async function disconnectMySQL() {
   return new Promise((resolve, reject) => {
-    m.end(err => {
+    m.end((err) => {
       if (err) {
         reject(new Error(`Error disconnecting: ${err.stack}`));
         return;
@@ -255,10 +248,9 @@ module.exports = async (selectOptions, callbacks) => {
   };
 
   settings = getSettings();
-  setDeployModeOptions(settings);
 
   if (options.mode !== DEPLOY_MODES.SQL_ONLY) {
-    if (!isCI() && options.environment === 'production') {
+    if (options.environment === 'production') {
       try {
         const unstagedFiles = await git.getUnstagedFiles();
         if (unstagedFiles.length > 0) {
@@ -271,17 +263,16 @@ module.exports = async (selectOptions, callbacks) => {
       }
     }
 
-    // Run the build task in a separate process
-    await runProjectBuildTask(options.environment);
+    // Run the build task in a separate process, outputs to dist-deploy
+    const deployBuildDir = await runProjectBuildTask(options.environment);
+    setDeployModeOptions(deployBuildDir);
     await deployToServer();
+
+    // Clean up the temporary deploy build directory
+    await rimraf(getProjectPath(deployBuildDir));
   }
 
   if (options.sql) {
-    if (isCI()) {
-      console.log(options);
-      return deploySQLFromCI(options);
-    }
-
     const file = await exportSql({ environment: options.environment });
     await createTunnel();
     await connectMySQL();

package/lib/importSQL.js

@@ -10,7 +10,7 @@ const { SQL_BACKUPS_DIR } = require('../constants');
 const { sqlPath } = require('../utils/getSqlPath');
 
 async function importSQL(database, file) {
-  const importCommand = `${sqlPath}/mysql -uroot -proot ${database} < "${file}"`;
+  const importCommand = `${sqlPath}/mysql --force -uroot -proot ${database} < "${file}"`;
 
   await execAsync(importCommand);
   logger.log('Imported SQL successfully');

package/lib/index.js

@@ -5,7 +5,6 @@ const devProject = require('./devProject');
 const exportSQL = require('./exportSQL');
 const importSQL = require('./importSQL');
 const setupProject = require('./setupProject');
-const addSettings = require('./addSettings');
 
 module.exports = {
   backupProject,
@@ -15,5 +14,4 @@ module.exports = {
   exportSQL,
   importSQL,
   setupProject,
-  addSettings,
 };

package/lib/pullSQL.js

@@ -28,9 +28,7 @@ module.exports = async (options) => {
     fs.mkdirSync(destinationDir, { recursive: true });
   }
 
-  // 14/10/24 Fixes issue where /*!999999\- enable the sandbox mode */ is added as first line of SQL dump
-  const sed = `| sed '/\\/\\*!999999/d'`;
-  const command = `mysqldump --add-drop-table --user='${user}' --password='${password}' ${database} ${sed}`;
+  const command = `mysqldump --add-drop-table --user='${user}' --password='${password}' ${database}`;
 
   let privateKey;
   if (options.serverPrivateKey) {

package/lib/setupProject.js

@@ -6,7 +6,7 @@ const replace = require('replace-in-file');
 const logger = require('../logger');
 const getProjectPath = require('../utils/getProjectPath');
 
-const getReplacements = options => [
+const getReplacements = (options) => [
   ['{{projectLocation}}', options.projectLocation],
   ['{{projectSlug}}', slugify(options.projectSlug).toLowerCase()],
   ['{{projectName}}', options.project],
@@ -16,11 +16,10 @@ const getReplacements = options => [
   ['{{tablePrefix}}', options.tablePrefix],
   ['{{database}}', options.database],
   ['{{productionDomain}}', options.productionDomain],
-  ['{{productionDomain}}', options.productionDomain],
   ['project-slug-package-json', slugify(options.projectSlug).toLowerCase()],
 ];
 
-module.exports = async options => {
+module.exports = async (options) => {
   const projectPath = getProjectPath();
   const filesToReplace = [
     ...glob.sync('config/*', { cwd: projectPath, dot: true }),
@@ -38,15 +37,14 @@ module.exports = async options => {
   let files = filesToReplace;
   if (getProjectPath() !== process.cwd()) {
     // Check if the script is being run from outside of the project and then fix the paths
-    files = files.map(file => getProjectPath(file));
+    files = files.map((file) => getProjectPath(file));
   }
 
   // Remove any files that don't exist
   files = files.filter(fs.existsSync);
 
   // Run sequentially to ensure replace only operates on one file at a time
-  for (var i = 0; i < replacements.length; i++) {
-    const [from, to] = replacements[i];
+  for (const [from, to] of replacements) {
     await replace({
       files,
       from: new RegExp(from, 'g'),

package/overridable/checkProjectDependencies.js

@@ -1,4 +1,5 @@
 const fs = require('fs');
+const path = require('path');
 const chalk = require('chalk');
 
 const logger = require('../logger');
@@ -23,31 +24,39 @@ async function checkProjectDependencies() {
     logger.warn('You are using an old version of fx-classes, please upgrade to at least v2.');
   }
 
-  // Husky pre-commit hooks activation and migration from v4 to v8
   const huskyDirectory = getProjectPath('.husky');
   const oldHuskyConfig = getProjectPath('.huskyrc.js');
+  const preCommitHook = getProjectPath('.husky', 'pre-commit');
+  const postMergeHook = getProjectPath('.husky', 'post-merge');
 
-  // Delete old config if it exists
+  // Migrate away from legacy .huskyrc.js (v4)
   if (fs.existsSync(oldHuskyConfig)) {
     try {
       fs.rmSync(oldHuskyConfig);
       logger.info('Old Husky config deleted');
     } catch (err) {
-      console.warn('Error while deleting old Husky config:', err);
+      logger.warn('Error while deleting old Husky config:', err);
     }
   }
 
-  if (!fs.existsSync(huskyDirectory)) {
-    // Husky now requires a "one-time" explicit git hook activation
-    const husky = `node_modules/.bin/husky`;
-
-    await execAsync(`${husky} install`);
-    logger.info('Upgrading Husky git hooks config');
-    await execAsync(`${husky} add .husky/pre-commit 'npx lint-staged'`);
-    await execAsync(
-      `${husky} add .husky/post-merge 'node_modules/.bin/wp-scripts hooks --type="post-merge"'`
+  // Detect v8-format hooks (contain the _/husky.sh source line)
+  const hasV8Hook =
+    fs.existsSync(preCommitHook) && fs.readFileSync(preCommitHook, 'utf8').includes('_/husky.sh');
+
+  const husky = path.resolve(__dirname, '..', 'node_modules', '.bin', 'husky');
+
+  if (!fs.existsSync(huskyDirectory) || hasV8Hook) {
+    // Resolve husky from wp-blank-scripts' own node_modules so it works regardless
+    // of how the project manages its dependencies (yarn, pnpm, npm link, etc.)
+    await execAsync(`${husky}`);
+    fs.mkdirSync(huskyDirectory, { recursive: true });
+    fs.writeFileSync(preCommitHook, '#!/bin/sh\nnode_modules/.bin/lint-staged\n', { mode: 0o755 });
+    fs.writeFileSync(
+      postMergeHook,
+      '#!/bin/sh\nnode_modules/.bin/wp-scripts hooks --type="post-merge"\n',
+      { mode: 0o755 }
     );
-    logger.success('Husky upgrade successful!');
+    logger.success(hasV8Hook ? 'Husky git hooks migrated to v9' : 'Husky git hooks installed');
   }
 }
 

package/overridable/index.js

@@ -8,10 +8,8 @@ if (fs.existsSync(overridesPath)) {
 }
 
 const checkProjectDependencies = require('./checkProjectDependencies');
-const copyFx = require('./copyFx');
 
 module.exports = {
   checkProjectDependencies,
-  copyFx,
   ...overrides,
 };