From 83d2ade0c7a5c4b64e0791b0e27902620b470b07 Mon Sep 17 00:00:00 2001 From: Sandeep Venkata Date: Fri, 5 Apr 2019 14:18:19 +0530 Subject: [PATCH] Adding buildpackage.js to build twin packages - We will publish two packages: - azdevops-kube-summary: marked azure-devops-ui as external and removed from package.json - webapp-kube-summary: includes bundled azure-devops-ui --- .gitignore | 2 +- ...ck.config.js => azdevops.webpack.config.js | 2 +- buildpackage.js | 83 +++++++++++++++++++ package.json | 3 +- webapp.webpack.config.js | 68 +++++++++++++++ 5 files changed, 155 insertions(+), 3 deletions(-) rename webpack.config.js => azdevops.webpack.config.js (93%) create mode 100644 buildpackage.js create mode 100644 webapp.webpack.config.js diff --git a/.gitignore b/.gitignore index 960369f..67f25d2 100644 --- a/.gitignore +++ b/.gitignore @@ -5,7 +5,7 @@ npm-debug.log node_modules/ -_bundles/ +_bin/ dist/ dist_tests/ *.vsix diff --git a/webpack.config.js b/azdevops.webpack.config.js similarity index 93% rename from webpack.config.js rename to azdevops.webpack.config.js index 7ef6ffe..845eac7 100644 --- a/webpack.config.js +++ b/azdevops.webpack.config.js @@ -9,7 +9,7 @@ module.exports = { 'azdevops-kube-summary.min': './src/index.ts' }, output: { - path: path.resolve(__dirname, '_bundles'), + path: path.resolve(__dirname, '_bin/azDevOpsPackage/_bundles'), filename: '[name].js', libraryTarget: 'umd', library: 'azdevops-kube-summary', diff --git a/buildpackage.js b/buildpackage.js new file mode 100644 index 0000000..e9100a6 --- /dev/null +++ b/buildpackage.js @@ -0,0 +1,83 @@ +/** + * This is solely a build script, intended to prep the twin packages for publishing. + */ + +const fs = require("fs"); +const path = require("path"); +const rimraf = require("rimraf"); +const copydir = require("copy-dir"); +const execSync = require("child_process").execSync; + +// AzDevOps Package Constants +const azDevOpsPackageName = "@azurepipelines/azdevops-kube-summary"; +const azDevOpsWebPackConfigFileName = "azdevops.webpack.config.js"; +const azDevOpsPackageFolderName = "azDevOpsPackage"; + +// WebApp Package Constants +const webAppPackageName = "@azurepipelines/webapp-kube-summary"; +const webAppWebPackConfigFileName = "webapp.webpack.config.js"; +const webAppPackageFolderName = "webAppPackage"; + +prepPackage(azDevOpsPackageFolderName, azDevOpsWebPackConfigFileName, editAzDevOpsPackageJson); +prepPackage(webAppPackageFolderName, webAppWebPackConfigFileName, editWebAppPackageJson); + +function prepPackage(packageFolderName, webpackConfigFileName, editPackageJsonCallback) { + const binFolderPath = path.join(__dirname, "_bin"); + ensureDirExists(binFolderPath); + + const packageFolderPath = path.join(binFolderPath, packageFolderName); + console.log(`Deleting folder: ${packageFolderName}`); + rimraf.sync(packageFolderPath); + + console.log(`Creating folder: ${packageFolderName}`); + fs.mkdirSync(packageFolderPath); + fs.statSync + console.log(`Copying package.json, README.md and LICENSE.txt to ${packageFolderName}`); + filesToCopy = ["package.json", "README.md", "LICENSE.txt"]; + filesToCopy.forEach(fileName => { + srcFilePath = path.join(__dirname, fileName); + targetFilePath = path.join(packageFolderPath, fileName); + fs.copyFileSync(srcFilePath, targetFilePath); + }); + + console.log(`Altering package.json inside ${packageFolderName}`); + const targetPackageJsonPath = path.join(packageFolderPath, "package.json"); + let targetPackageJsonContent = fs.readFileSync(targetPackageJsonPath); + let parsedTargetPackageJson = JSON.parse(targetPackageJsonContent); + parsedTargetPackageJson = editPackageJsonCallback(parsedTargetPackageJson); + fs.writeFileSync(targetPackageJsonPath, JSON.stringify(parsedTargetPackageJson, null, 2)); + + console.log(`Copying dist folder to ${packageFolderName}`); + const srcDistFolderPath = path.join(__dirname, "dist"); + const targetDistFolderPath = path.join(packageFolderPath, "dist"); + copydir.sync(srcDistFolderPath, targetDistFolderPath); + + console.log(`Running webpack for ${packageFolderName}`); + const webPackConfigFilePath = path.join(__dirname, webpackConfigFileName); + execSync(`webpack --mode production --config ${webPackConfigFilePath}`, { + stdio: 'inherit' + }); + + console.log(`Packaging ${packageFolderName}`); + execSync("npm pack", { + cwd: packageFolderPath, + stdio: 'inherit' + }); +} + +function ensureDirExists(dirPath) { + if (!fs.existsSync(dirPath)){ + fs.mkdirSync(dirPath); + } +} + +function editAzDevOpsPackageJson(parsedPackageJson) { + parsedPackageJson.name = azDevOpsPackageName; + delete parsedPackageJson.dependencies["azure-devops-ui"]; + return parsedPackageJson; +} + +function editWebAppPackageJson(parsedPackageJson) { + parsedPackageJson.name = webAppPackageName; + return parsedPackageJson; +} \ No newline at end of file diff --git a/package.json b/package.json index 1aa889e..c07b5dc 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,7 @@ "scripts": { "clean": "rimraf ./dist && rimraf ./_bundles", "compile": "npm run clean && npm run compilesrc && npm run copy-all", - "build": "npm run compile && webpack --mode production && npm pack", + "build": "npm run compile && node buildpackage.js", "copy-all": "npm run copy-scss && npm run copy-resources && npm run copy-images", "copy-scss": "copyfiles -u 1 src/**/*.scss ./dist", "copy-resources": "copyfiles -u 1 src/**/Resources.js ./dist", @@ -54,6 +54,7 @@ "@types/react": "16.8.2", "@types/react-dom": "16.8.2", "base64-inline-loader": "^1.1.1", + "copy-dir": "^0.4.0", "copy-webpack-plugin": "^4.6.0", "copyfiles": "^2.1.0", "css-loader": "^1.0.1", diff --git a/webapp.webpack.config.js b/webapp.webpack.config.js new file mode 100644 index 0000000..face257 --- /dev/null +++ b/webapp.webpack.config.js @@ -0,0 +1,68 @@ +const path = require('path'); +const webpack = require('webpack'); +const UglifyJsPlugin = require('uglifyjs-webpack-plugin'); +const TerserPlugin = require('terser-webpack-plugin'); + +module.exports = { + entry: { + 'azdevops-kube-summary': './src/index.ts', + 'azdevops-kube-summary.min': './src/index.ts' + }, + output: { + path: path.resolve(__dirname, '_bin/webAppPackage/_bundles'), + filename: '[name].js', + libraryTarget: 'umd', + library: 'webapp-kube-summary', + umdNamedDefine: true + }, + resolve: { + extensions: ['.ts', '.tsx', '.js'] + }, + devtool: 'source-map', + optimization: { + minimizer: [ + new TerserPlugin({ + sourceMap: true, + include: /\.min\.js$/, + parallel: 4 + }) + ] + }, + module: { + rules: [ + { + test: /\.tsx?$/, + loader: "ts-loader" + }, + { + test: /\.scss$/, + use: ["style-loader", "css-loader", "./buildScripts/css-variables-loader", "sass-loader"] + }, + { + test: /\.css$/, + use: ["style-loader", "css-loader"], + }, + { + test: /\.woff$/, + use: [{ + loader: 'base64-inline-loader' + }] + }, + { + test: /\.html$/, + loader: "file-loader" + }, + { test: /\.(png|jpg|svg)$/, loader: 'file-loader' }, + ] + }, + node: { + fs: 'empty', + tls: 'mock', + child_process: 'empty', + net: 'empty' + }, + externals: { + "react": 'react', + "react-dom": 'react-dom' + } +} \ No newline at end of file