From c6e399c8c001137bb7e04cef3315a7343b644082 Mon Sep 17 00:00:00 2001 From: Hawk Ticehurst <39639992+hawkticehurst@users.noreply.github.com> Date: Mon, 21 Nov 2022 12:43:17 -0800 Subject: [PATCH] Add type module (#421) Description of changes Add `type: module` to package.json and update various build/test scripts. --- .eslintrc.js => .eslintrc.cjs | 0 .../{babel.config.js => babel.config.cjs} | 0 .storybook/{main.js => main.cjs} | 0 package.json | 1 + scripts/helpers.js | 52 ++++++++----------- scripts/move-react-build-dir.js | 10 ++-- scripts/setup-webview-test-env.js | 16 +++--- 7 files changed, 36 insertions(+), 43 deletions(-) rename .eslintrc.js => .eslintrc.cjs (100%) rename .storybook/{babel.config.js => babel.config.cjs} (100%) rename .storybook/{main.js => main.cjs} (100%) diff --git a/.eslintrc.js b/.eslintrc.cjs similarity index 100% rename from .eslintrc.js rename to .eslintrc.cjs diff --git a/.storybook/babel.config.js b/.storybook/babel.config.cjs similarity index 100% rename from .storybook/babel.config.js rename to .storybook/babel.config.cjs diff --git a/.storybook/main.js b/.storybook/main.cjs similarity index 100% rename from .storybook/main.js rename to .storybook/main.cjs diff --git a/package.json b/package.json index 45ba538..fcfd656 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ "homepage": "https://github.com/microsoft/vscode-webview-ui-toolkit#readme", "license": "MIT", "author": "Microsoft Corporation", + "type": "module", "bugs": { "url": "https://github.com/microsoft/vscode-webview-ui-toolkit/issues" }, diff --git a/scripts/helpers.js b/scripts/helpers.js index d81fafa..c996100 100644 --- a/scripts/helpers.js +++ b/scripts/helpers.js @@ -1,26 +1,26 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. -const fs = require('fs'); -const path = require('path'); +import {existsSync, lstatSync, mkdirSync, readdirSync, readFileSync, rmdirSync, unlinkSync, writeFileSync} from 'fs'; +import path from 'path'; -function createDir(dir) { - if (!fs.existsSync(dir)) { - fs.mkdirSync(dir); +export function createDir(dir) { + if (!existsSync(dir)) { + mkdirSync(dir); } } -function copyDir(source, target) { +export function copyDir(source, target) { let files = []; const targetFolder = path.join(target, path.basename(source)); - if (!fs.existsSync(targetFolder)) { - fs.mkdirSync(targetFolder); + if (!existsSync(targetFolder)) { + mkdirSync(targetFolder); } - if (fs.lstatSync(source).isDirectory()) { - files = fs.readdirSync(source); + if (lstatSync(source).isDirectory()) { + files = readdirSync(source); files.forEach(function (file) { const curSource = path.join(source, file); - if (fs.lstatSync(curSource).isDirectory()) { + if (lstatSync(curSource).isDirectory()) { copyDir(curSource, targetFolder); } else { copyFile(curSource, targetFolder); @@ -29,14 +29,14 @@ function copyDir(source, target) { } } -function copyFile(source, target) { +export function copyFile(source, target) { let targetFile = target; - if (fs.existsSync(target)) { - if (fs.lstatSync(target).isDirectory()) { + if (existsSync(target)) { + if (lstatSync(target).isDirectory()) { targetFile = path.join(target, path.basename(source)); } } - fs.writeFileSync(targetFile, fs.readFileSync(source)); + writeFileSync(targetFile, readFileSync(source)); } const colors = { @@ -48,7 +48,7 @@ const colors = { cyan: '\x1b[36m', }; -function color(opts, text) { +export function color(opts, text) { let colorString = ''; for (const opt of opts) { colorString += colors[opt]; @@ -56,24 +56,16 @@ function color(opts, text) { return `${colorString}${text}${colors.reset}`; } -function delDir(path) { - if (fs.existsSync(path) && fs.lstatSync(path).isDirectory()) { - fs.readdirSync(path).forEach(function (file, index) { +export function delDir(path) { + if (existsSync(path) && lstatSync(path).isDirectory()) { + readdirSync(path).forEach(function (file, index) { const currPath = path + '/' + file; - if (fs.lstatSync(currPath).isDirectory()) { + if (lstatSync(currPath).isDirectory()) { delDir(currPath); } else { - fs.unlinkSync(currPath); + unlinkSync(currPath); } }); - fs.rmdirSync(path); + rmdirSync(path); } } - -module.exports = { - createDir, - copyDir, - copyFile, - color, - delDir, -}; diff --git a/scripts/move-react-build-dir.js b/scripts/move-react-build-dir.js index fb1c02d..9665ba8 100755 --- a/scripts/move-react-build-dir.js +++ b/scripts/move-react-build-dir.js @@ -1,9 +1,9 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. -const {copyDir, color, delDir} = require('./helpers'); -const fsPromises = require('fs').promises; -const process = require('process'); +import {copyDir, color, delDir} from './helpers.js'; +import process from 'process'; +import {readFile, writeFile} from 'fs/promises'; /** * Developer note: @@ -67,7 +67,7 @@ async function updateReactBuildImportPaths(path) { // Read React build file and update import paths if appropriate try { - const fileContents = await fsPromises.readFile(path, {encoding: 'utf8'}); + const fileContents = await readFile(path, {encoding: 'utf8'}); // These regex strings rely on an assumption that they will not change // If importing React components from the toolkit starts to break check here first result = fileContents.replace(/\.\.\/index/g, '../dist/index'); @@ -80,7 +80,7 @@ async function updateReactBuildImportPaths(path) { // Overwrite React build file with any updated import paths try { - await fsPromises.writeFile(path, result, {encoding: 'utf8'}); + await writeFile(path, result, {encoding: 'utf8'}); } catch (err) { console.log(`${color(['red'], 'Error: Writing new React build file import paths failed.')}\n ${err}`); process.exit(); diff --git a/scripts/setup-webview-test-env.js b/scripts/setup-webview-test-env.js index 70abe77..dd8063d 100644 --- a/scripts/setup-webview-test-env.js +++ b/scripts/setup-webview-test-env.js @@ -1,20 +1,20 @@ // Copyright (c) Microsoft Corporation. // Licensed under the MIT License. -const {createDir, copyDir, color, delDir} = require('./helpers'); -const {exec} = require('child_process'); -const fs = require('fs'); -const process = require('process'); -const util = require('util'); +import {createDir, copyDir, color, delDir} from './helpers.js'; +import {existsSync} from 'fs'; +import {exec} from 'child_process'; +import {promisify} from 'util'; +import process from 'process'; -const execShellCommand = util.promisify(exec); +const execShellCommand = promisify(exec); async function main() { // Empty print line to pretty-ify command line output console.log(); // Copy webview test environment locally if it does not already exist - if (!fs.existsSync('./test-webview')) { + if (!existsSync('./test-webview')) { try { console.log(color(['dim'], 'Copying webview test environment locally...')); await execShellCommand('npx degit microsoft/vscode-webview-ui-toolkit-samples/default/component-gallery test-webview'); @@ -25,7 +25,7 @@ async function main() { } // Install the webview test environment dependencies if they do not exist - if (!fs.existsSync('./test-webview/node_modules')) { + if (!existsSync('./test-webview/node_modules')) { try { console.log(color(['dim'], 'Installing webview test environment dependencies...')); await execShellCommand('cd ./test-webview && npm install');