Merge pull request #387 from spotify/mob/roll2

Improve the plugin build script with rollup
This commit is contained in:
Niklas Ek
2020-04-02 12:42:44 +02:00
committed by GitHub
14 changed files with 537 additions and 84 deletions
+19 -3
View File
@@ -1,3 +1,19 @@
/* eslint-disable notice/notice */
export { default as HomePagePlugin } from '@backstage/plugin-home-page';
export { default as WelcomePlugin } from '@backstage/plugin-welcome';
/*
* Copyright 2020 Spotify AB
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { default as HomePagePlugin } from '@backstage/plugin-home-page';
import { default as WelcomePlugin } from '@backstage/plugin-welcome';
export { HomePagePlugin, WelcomePlugin };
+17
View File
@@ -0,0 +1,17 @@
/*
* Copyright 2020 Spotify AB
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
declare module 'rollup-plugin-image-files';
+11 -2
View File
@@ -33,6 +33,8 @@
"@types/react-dev-utils": "^9.0.4",
"@types/recursive-readdir": "^2.2.0",
"@types/tar": "^4.0.3",
"@types/rollup-plugin-peer-deps-external": "^2.2.0",
"@types/rollup-plugin-postcss": "^2.0.0",
"@types/webpack": "^4.41.7",
"@types/webpack-dev-server": "^3.10.0",
"del": "^5.1.0",
@@ -46,6 +48,8 @@
"dependencies": {
"@lerna/package-graph": "^3.18.5",
"@lerna/project": "^3.18.0",
"@rollup/plugin-commonjs": "^11.0.2",
"@rollup/plugin-node-resolve": "^7.1.1",
"@spotify/web-scripts": "^6.0.0",
"chokidar": "^3.3.1",
"commander": "^4.1.1",
@@ -57,9 +61,14 @@
"inquirer": "^7.0.4",
"ora": "^4.0.3",
"react-dev-utils": "^10.2.0",
"react-scripts": "^3.4.0",
"react-scripts": "^3.4.1",
"recursive-readdir": "^2.2.2",
"replace-in-file": "^5.0.2",
"rollup": "^2.3.2",
"rollup-plugin-image-files": "^1.4.2",
"rollup-plugin-peer-deps-external": "^2.2.2",
"rollup-plugin-postcss": "^2.5.0",
"rollup-plugin-typescript2": "^0.26.0",
"ts-loader": "^6.2.1",
"webpack": "^4.41.6",
"webpack-dev-server": "^3.10.3"
@@ -72,7 +81,7 @@
],
"nodemonConfig": {
"watch": "./src",
"exec": "ts-node",
"exec": "ts-node ./src",
"ext": "ts"
}
}
@@ -67,18 +67,21 @@ const sortObjectByKeys = (obj: { [name in string]: string }) => {
const capitalize = (str: string): string =>
str.charAt(0).toUpperCase() + str.slice(1);
async function addExportStatement(file: string, exportStatement: string) {
const contents = await fs.readFile(file, 'utf8');
const newContents = contents
const addExportStatement = async (
file: string,
importStatement: string,
exportStatement: string,
) => {
const newContents = fs
.readFileSync(file, 'utf8')
.split('\n')
.filter(Boolean) // get rid of empty lines
.concat([exportStatement])
.sort()
.concat([importStatement, exportStatement])
.concat(['']) // newline at end of file
.join('\n');
await fs.writeFile(file, newContents, 'utf8');
}
};
export async function addPluginDependencyToApp(
rootDir: string,
@@ -118,16 +121,19 @@ export async function addPluginToApp(rootDir: string, pluginName: string) {
.split('-')
.map(name => capitalize(name))
.join('');
const pluginExport = `export { default as ${pluginNameCapitalized} } from '${pluginPackage}';`;
const pluginImport = `import { default as ${pluginNameCapitalized} } from '${pluginPackage}';`;
const pluginExport = `export { ${pluginNameCapitalized} };`;
const pluginsFilePath = 'packages/app/src/plugins.ts';
const pluginsFile = resolvePath(rootDir, pluginsFilePath);
await Task.forItem('processing', pluginsFilePath, async () => {
await addExportStatement(pluginsFile, pluginExport).catch(error => {
throw new Error(
`Failed to import plugin in app: ${pluginsFile}: ${error.message}`,
);
});
await addExportStatement(pluginsFile, pluginImport, pluginExport).catch(
error => {
throw new Error(
`Failed to import plugin in app: ${pluginsFile}: ${error.message}`,
);
},
);
});
}
+4
View File
@@ -94,3 +94,7 @@ declare module '*.module.sass' {
const classes: { readonly [key: string]: string };
export default classes;
}
declare module 'rollup-plugin-image-files' {
export default function image(): any;
}
+26 -33
View File
@@ -14,43 +14,36 @@
* limitations under the License.
*/
import { rollup, watch, OutputOptions } from 'rollup';
import conf from './rollup.config';
import { Command } from 'commander';
import fs from 'fs-extra';
import path from 'path';
import recursive from 'recursive-readdir';
import { run } from '../../helpers/run';
const copyStaticAssets = async () => {
const pluginRoot = fs.realpathSync(process.cwd());
const source = path.resolve(pluginRoot, 'src');
const destination = path.resolve(pluginRoot, 'dist', 'cjs');
const assetFiles = await recursive(source, [
'**/*.tsx',
'**/*.ts',
'**/*.js',
]);
assetFiles.forEach(file => {
const fileToBeCopied = file.replace(source, destination);
const dirForFileToBeCopied = path.dirname(fileToBeCopied);
fs.ensureDirSync(dirForFileToBeCopied);
fs.copyFileSync(file, file.replace(source, destination).toString());
});
};
export default async (cmd: Command) => {
const args = [
'--outDir',
'dist/cjs',
'--noEmit',
'false',
'--module',
'CommonJS',
];
if (cmd.watch) {
args.push('--watch');
// We're not resolving this promise because watch() doesn't have any exit event.
// Instead we just wait until the user sends an interrupt signal.
await new Promise(() => {
const watcher = watch(conf);
watcher.on('event', event => {
// START — the watcher is (re)starting
// BUNDLE_START — building an individual bundle
// BUNDLE_END — finished building a bundle
// END — finished building all bundles
// ERROR — encountered an error while bundling
if (event.code === 'ERROR') {
console.log(event.error);
} else {
console.log(event.code);
}
});
});
}
await copyStaticAssets();
await run('tsc', args);
const bundle = await rollup({
input: conf.input,
plugins: conf.plugins,
});
await bundle.generate(conf.output as OutputOptions);
await bundle.write(conf.output as OutputOptions);
};
@@ -0,0 +1,42 @@
/*
* Copyright 2020 Spotify AB
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import peerDepsExternal from 'rollup-plugin-peer-deps-external';
import typescript from 'rollup-plugin-typescript2';
import commonjs from '@rollup/plugin-commonjs';
import resolve from '@rollup/plugin-node-resolve';
import postcss from 'rollup-plugin-postcss';
import imageFiles from 'rollup-plugin-image-files';
import { RollupWatchOptions } from 'rollup';
export default {
input: 'src/index.ts',
output: {
file: 'dist/index.cjs.js',
format: 'cjs',
},
plugins: [
peerDepsExternal(),
resolve(),
commonjs({
include: ['node_modules/**', '../../node_modules/**'],
exclude: ['**/*.stories.js'],
}),
postcss(),
imageFiles(),
typescript(),
],
} as RollupWatchOptions;
-1
View File
@@ -143,4 +143,3 @@ process.on('unhandledRejection', rejection => {
});
main(process.argv);
// main([process.argv[0], process.argv[1], '--version']);
@@ -1,22 +1,32 @@
{
"name": "@backstage/plugin-{{id}}",
"version": "{{version}}",
"main": "dist/cjs/index.js",
"types": "dist/cjs/index.d.ts",
"main": "dist/index.cjs.js",
"types": "dist/index.d.ts",
"license": "Apache-2.0",
"private": true,
"scripts": {
"build:watch": "backstage-cli plugin:build --watch",
"build": "backstage-cli build-cache -- backstage-cli plugin:build",
"lint": "backstage-cli lint",
"test": "backstage-cli test"
},
"devDependencies": {
"@backstage/cli": "^{{version}}",
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.3.2",
"@testing-library/user-event": "^7.1.2",
"@types/jest": "^24.0.0",
"@types/node": "^12.0.0",
"@types/testing-library__jest-dom": "5.0.2",
"jest-fetch-mock": "^3.0.3"
},
"dependencies": {
"@backstage/core": "^{{version}}",
"@material-ui/lab": "4.0.0-alpha.45"
"peerDependencies": {
"@backstage/core": "^0.1.0",
"@material-ui/core": "^4.9.1",
"@material-ui/icons": "^4.9.1",
"@material-ui/lab": "4.0.0-alpha.45",
"react": "16.13.1",
"react-dom": "16.13.1"
}
}