From effeec58af94f59b10773d8dd1c1102972ff55bc Mon Sep 17 00:00:00 2001 From: Jordan Jones Date: Thu, 26 Sep 2024 10:23:42 -0700 Subject: [PATCH] refactor: use auro-library build scripts --- package.json | 8 +- scripts/generateDocs.mjs | 210 ------------------------------- scripts/postCss.mjs | 62 --------- scripts/pre-commit.mjs | 17 --- scripts/staticStyles-template.js | 2 - 5 files changed, 4 insertions(+), 295 deletions(-) delete mode 100644 scripts/generateDocs.mjs delete mode 100644 scripts/postCss.mjs delete mode 100644 scripts/pre-commit.mjs delete mode 100644 scripts/staticStyles-template.js diff --git a/package.json b/package.json index a2095ff..0e8f9ea 100644 --- a/package.json +++ b/package.json @@ -147,7 +147,7 @@ "build:ci": "npm-run-all sweep build:release", "build:api": "wca analyze 'src/auro-carousel.js' --outFiles docs/api.md", "build:dev:assets": "npm-run-all build:sass:component postCss:component sass:render build:docs", - "build:docs": "node scripts/generateDocs.mjs", + "build:docs": "node ./node_modules/@aurodesignsystem/auro-library/scripts/build/generateDocs.mjs", "build:sass": "npm-run-all build:sass:component postCss:component sass:render", "build:sass:component": "sass --no-source-map src:src", "build:version": "node scripts/version.mjs", @@ -159,10 +159,10 @@ "dist:js": "copyfiles -u 1 -V './src/**/*.js' ./dist", "esLint": "./node_modules/.bin/eslint src/**/*.js --ignore-pattern 'src/**/*Version.js'", "linters": "npm-run-all scssLint esLint", - "preCommit": "node scripts/pre-commit.mjs", - "postCss:component": "node scripts/postCss.mjs", + "preCommit": "node ./node_modules/@aurodesignsystem/auro-library/scripts/build/pre-commit.mjs", + "postCss:component": "node ./node_modules/@aurodesignsystem/auro-library/scripts/build/postCss.mjs", "postinstall": "node packageScripts/postinstall.mjs", - "sass:render": "sass-render src/*.css -t ./scripts/staticStyles-template.js", + "sass:render": "sass-render src/*.css -t ./node_modules/@aurodesignsystem/auro-library/scripts/build/staticStyles-template.js", "serve": "web-dev-server --open demo/ --node-resolve --watch", "sweep": "rm -rf ./demo/css ./dist | rm ./src/*.css ./src/*-css.js", "test": "wtr --coverage", diff --git a/scripts/generateDocs.mjs b/scripts/generateDocs.mjs deleted file mode 100644 index 5a21cb4..0000000 --- a/scripts/generateDocs.mjs +++ /dev/null @@ -1,210 +0,0 @@ -import path from 'path'; -import markdownMagic from 'markdown-magic'; -import fs from 'fs'; -import https from 'https'; - -const __dirname = new URL('.', import.meta.url).pathname; - -const readmeTemplateUrl = 'https://raw.githubusercontent.com/AlaskaAirlines/WC-Generator/master/componentDocs/README_esm.md'; -const dirDocTemplates = './docTemplates'; -const readmeFilePath = dirDocTemplates + '/README.md'; - -/** - * Extract NPM, NAMESPACE and NAME from package.json - */ - -function nameExtraction() { - const packageJson = fs.readFileSync('package.json', 'utf8', function(err, data) { - if (err) { - console.log('ERROR: Unable to read package.json file', err); - } - }) - - let pName = JSON.parse(packageJson).name; - let pVersion = JSON.parse(packageJson).version; - let pdtVersion = JSON.parse(packageJson).peerDependencies['\@aurodesignsystem/design-tokens'].substring(1) - let wcssVersion = JSON.parse(packageJson).peerDependencies['\@aurodesignsystem/webcorestylesheets'].substring(1) - - let npmStart = pName.indexOf('@'); - let namespaceStart = pName.indexOf('/'); - let nameStart = pName.indexOf('-'); - - let result = { - 'npm': pName.substring(npmStart, namespaceStart), - 'namespace': pName.substring(namespaceStart + 1, nameStart), - 'namespaceCap': pName.substring(namespaceStart + 1)[0].toUpperCase() + pName.substring(namespaceStart + 2, nameStart), - 'name': pName.substring(nameStart + 1), - 'nameCap': pName.substring(nameStart + 1)[0].toUpperCase() + pName.substring(nameStart + 2), - 'version': pVersion, - 'tokensVersion': pdtVersion, - 'wcssVersion': wcssVersion - }; - - return result; - } - -/** - * Replace all instances of [npm], [name], [Name], [namespace] and [Namespace] accordingly - */ - -function formatTemplateFileContents(content, destination) { - let nameExtractionData = nameExtraction(); - let result = content; - - /** - * Replace placeholder strings - */ - result = result.replace(/\[npm]/g, nameExtractionData.npm); - result = result.replace(/\[name](?!\()/g, nameExtractionData.name); - result = result.replace(/\[Name](?!\()/g, nameExtractionData.nameCap); - result = result.replace(/\[namespace]/g, nameExtractionData.namespace); - result = result.replace(/\[Namespace]/g, nameExtractionData.namespaceCap); - result = result.replace(/\[Version]/g, nameExtractionData.version); - result = result.replace(/\[dtVersion]/g, nameExtractionData.tokensVersion); - result = result.replace(/\[wcssVersion]/g, nameExtractionData.wcssVersion); - - /** - * Cleanup line breaks - */ - result = result.replace(/(\r\n|\r|\n)[\s]+(\r\n|\r|\n)/g, '\r\n\r\n'); // Replace lines containing only whitespace with a carriage return. - result = result.replace(/>(\r\n|\r|\n){2,}/g, '>\r\n'); // Remove empty lines directly after a closing html tag. - result = result.replace(/>(\r\n|\r|\n)```/g, '>\r\n\r\n```'); // Ensure an empty line before code samples. - result = result.replace(/>(\r\n|\r|\n){2,}```(\r\n|\r|\n)/g, '>\r\n```\r\n'); // Ensure no empty lines before close of code sample. - result = result.replace(/([^(\r\n|\r|\n)])(\r?\n|\r(?!\n))+#/g, "$1\r\n\r\n#"); // Ensure empty line before header sections. - - /** - * Write the result to the destination file - */ - fs.writeFileSync(destination, result, { encoding: 'utf8'}); -} - -function formatApiTableContents(content, destination) { - const nameExtractionData = nameExtraction(); - const wcName = nameExtractionData.namespace + '-' + nameExtractionData.name; - - let result = content; - - result = result - .replace(/\r\n|\r|\n####\s`([a-zA-Z]*)`/g, `\r\n#### \`$1\`back to top`) - .replace(/\r\n|\r|\n\|\s`([a-zA-Z]*)`/g, '\r\n| [$1](#$1)') - .replace(/\| \[\]\(#\)/g, ""); - - fs.writeFileSync(destination, result, { encoding: 'utf8'}); - - fs.readFile('./demo/api.md', 'utf8', function(err, data) { - formatTemplateFileContents(data, './demo/api.md'); - }); -} - -/** - * Compiles `./docTemplates/README.md` -> `./README.md` - */ - -function processReadme() { - const callback = function(updatedContent, outputConfig) { - - if (fs.existsSync('./README.md')) { - fs.readFile('./README.md', 'utf8', function(err, data) { - formatTemplateFileContents(data, './README.md'); - }); - } else { - console.log('ERROR: ./README.md file is missing'); - } - }; - - const config = { - matchWord: 'AURO-GENERATED-CONTENT', - outputDir: './' - }; - - const markdownPath = path.join(__dirname, '../docTemplates/README.md'); - - markdownMagic(markdownPath, config, callback); -} - -/** - * Compiles `./docTemplates/index.md` -> `./demo/index.md` - */ - -function processDemo() { - const callback = function(updatedContent, outputConfig) { - if (fs.existsSync('./demo/index.md')) { - fs.readFile('./demo/index.md', 'utf8', function(err, data) { - formatTemplateFileContents(data, './demo/index.md'); - }); - } else { - console.log('ERROR: ./demo/index.md file is missing'); - } - }; - - const configDemo = { - matchWord: 'AURO-GENERATED-CONTENT', - outputDir: './demo' - }; - - const markdownPath = path.join(__dirname, '../docs/partials/index.md'); - - markdownMagic(markdownPath, configDemo, callback); -} - -/** - * Compiles `./docTemplates/api.md` -> `./demo/api.md` - */ - -function processApiExamples() { - const callback = function(updatedContent, outputConfig) { - if (fs.existsSync('./demo/api.md')) { - fs.readFile('./demo/api.md', 'utf8', function(err, data) { - formatApiTableContents(data, './demo/api.md'); - }); - } else { - console.log('ERROR: ./demo/api.md file is missing'); - } - }; - - const config = { - matchWord: 'AURO-GENERATED-CONTENT', - outputDir: './demo' - }; - - const markdownPath = path.join(__dirname, '../docs/partials/api.md'); - - markdownMagic(markdownPath, config, callback); -} - -/** - * Copy README.md template from static source - * */ - -function copyReadmeLocally() { - - if (!fs.existsSync(dirDocTemplates)){ - fs.mkdirSync(dirDocTemplates); - } - - if (!fs.existsSync(readmeFilePath)) { - fs.writeFile(readmeFilePath, '', function(err) { - if(err) { - console.log('ERROR: Unable to create README.md file.', err); - } - }); - } - - https.get(readmeTemplateUrl, function(response) { - let writeTemplate = response.pipe(fs.createWriteStream(readmeFilePath)); - - writeTemplate.on('finish', () => { - processReadme(); - }); - - }).on('error', (err) => { - console.log('ERROR: Unable to fetch README.md file from server.', err); - }); -} - -/** - * Run all the actual document generation - */ -copyReadmeLocally(); -processApiExamples(); -processDemo(); diff --git a/scripts/postCss.mjs b/scripts/postCss.mjs deleted file mode 100644 index a0966b6..0000000 --- a/scripts/postCss.mjs +++ /dev/null @@ -1,62 +0,0 @@ -import autoprefixer from 'autoprefixer'; -import postcss from 'postcss'; -import comments from 'postcss-discard-comments'; -import path from 'path'; -import fs from 'fs'; -const __dirname = new URL('.', import.meta.url).pathname; -const directoryPath = path.join(__dirname, '../src'); - -/** - * Default postCSS run - * Locates all CSS files within the directory and loop - * through the standardProcessor() function. - */ -fs.readdir(directoryPath, function (err, files) { - //handling error - if (err) { - return console.log('Unable to scan directory: ' + err); - } - //listing all files using forEach - files.forEach(function (file) { - if (file.includes(".css")) { - standardProcessor(file); - } - }); -}); - -/** - * The standardProcessor function applies tokens for fallback selectors - * and completes a post cleanup. - * @param {string} file - */ -function standardProcessor(file) { - fs.readFile(`src/${file}`, (err, css) => { - postcss([autoprefixer, comments]) - .use(comments({ - remove: function(comment) { return comment[0] == "@"; } - })) - .process(css, { from: `src/${file}`, to: `src/${file}` }) - .then(result => { - fs.writeFile(`src/${file}`, result.css, () => true) - }) - }); -} - -/** - * ALTERNATE script: - * The following is a static builder for rendering one - * CSS file at a time if that is required. - */ -// fs.readFile('src/style.css', (err, css) => { -// postcss([autoprefixer, comments]) -// .use(comments({ -// remove: function(comment) { return comment[0] == "@"; } -// })) -// .process(css, { from: 'src/style.css', to: 'src/style.css' }) -// .then(result => { -// fs.writeFile('src/style.css', result.css, () => true) -// if ( result.map ) { -// fs.writeFile('src/style.map', result.map, () => true) -// } -// }) -// }); diff --git a/scripts/pre-commit.mjs b/scripts/pre-commit.mjs deleted file mode 100644 index 781e45b..0000000 --- a/scripts/pre-commit.mjs +++ /dev/null @@ -1,17 +0,0 @@ -'use strict'; - -import chalk from 'chalk'; -console.log(chalk.hex('#ffd200')(` - -╭ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ──────────────────────────────╮`) + chalk.hex('#f26135')(` - - Are you familiar with Auro's Definition of Done? - - Please be sure to review`) + chalk.hex('#ffd200')(` - https://auro.alaskaair.com/definition-of-done`) + chalk.hex('#f26135')(` - before submitting your pull request - to ensure that you are compliant.`) + chalk.hex('#ffd200')(` - -╰─────────────────────────────── ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─╯ -`) -); diff --git a/scripts/staticStyles-template.js b/scripts/staticStyles-template.js deleted file mode 100644 index 2c41743..0000000 --- a/scripts/staticStyles-template.js +++ /dev/null @@ -1,2 +0,0 @@ -import {css} from 'lit'; -export default css`<% content %>`;