From 6990e3f7fdcc68f4c6a03ded3100ad2cbfb9168f Mon Sep 17 00:00:00 2001 From: plouc Date: Thu, 5 Nov 2020 08:14:36 +0900 Subject: [PATCH] feat(build): add build config for optional typescript support --- .gitignore | 1 + Makefile | 21 ++++++++++++++++----- babel.config.js | 2 +- conf/rollup.config.js | 27 +++++++++++++++++++-------- package.json | 5 ++--- tsconfig.json | 24 ++++++++++++++++-------- tsconfig.monorepo.json | 20 ++++++++++++++++++++ tsconfig.types.json | 8 ++++++++ 8 files changed, 83 insertions(+), 25 deletions(-) create mode 100644 tsconfig.monorepo.json create mode 100644 tsconfig.types.json diff --git a/.gitignore b/.gitignore index 8e8cda21b..b4e363b54 100644 --- a/.gitignore +++ b/.gitignore @@ -8,6 +8,7 @@ coverage package-lock.json build +*.tsbuildinfo /packages/*/dist diff --git a/Makefile b/Makefile index 7495f5f88..71d6c0bc1 100644 --- a/Makefile +++ b/Makefile @@ -54,7 +54,7 @@ init: ##@0 global cleanup/install/bootstrap fmt: ##@0 global format code using prettier (js, css, md) @./node_modules/.bin/prettier --color --write \ - "packages/*/{src,stories,tests}/**/*.{js,ts}" \ + "packages/*/{src,stories,tests}/**/*.{js,ts,tsx}" \ "packages/*/index.d.ts" \ "packages/*/README.md" \ "website/src/**/*.{js,css}" \ @@ -138,7 +138,8 @@ packages-tslint: ##@1 packages run tslint on all packages ./packages/legends/index.d.ts \ ./packages/line/index.d.ts \ ./packages/network/index.d.ts \ - ./packages/pie/index.d.ts \ + ./packages/pie/**/*.ts \ + ./packages/pie/**/*.tsx \ ./packages/radar/index.d.ts \ ./packages/sankey/index.d.ts \ ./packages/scales/index.d.ts \ @@ -165,15 +166,25 @@ packages-test-cover: ##@1 packages run tests for all packages with code coverage @echo "${YELLOW}Running test suites for all packages${RESET}" @yarn jest -c ./packages/jest.config.js --rootDir . --coverage ./packages/*/tests -packages-build: ##@1 packages build all packages +packages-types: ##@1 packages build all package types + @echo "${YELLOW}Building TypeScript types for all packages${RESET}" + @yarn tsc -b ./tsconfig.monorepo.json + +packages-build: packages-types ##@1 packages build all packages @echo "${YELLOW}Building all packages${RESET}" - @find ./packages -type d -maxdepth 1 ! -path ./packages ! -path ./packages/babel-preset \ + @find ./packages -type d -maxdepth 1 ! -path ./packages \ | sed 's|^./packages/||' \ | xargs -I '{}' sh -c '$(MAKE) package-build-{}' +package-types-%: ##@1 packages build a package types + @echo "${YELLOW}Building TypeScript types for package ${WHITE}@nivo/${*}${RESET}" + @-rm -rf ./packages/${*}/dist/types + @-rm -rf ./packages/${*}/dist/tsconfig.tsbuildinfo + @yarn tsc -b ./packages/${*} + package-build-%: ##@1 packages build a package @echo "${YELLOW}Building package ${WHITE}@nivo/${*}${RESET}" - @rm -rf ./packages/${*}/dist + @-rm -rf ./packages/${*}/dist @export PACKAGE=${*}; NODE_ENV=production BABEL_ENV=production ./node_modules/.bin/rollup -c conf/rollup.config.js packages-screenshots: ##@1 packages generate screenshots for packages readme (website dev server must be running) diff --git a/babel.config.js b/babel.config.js index 9e6da609f..c8b907d66 100644 --- a/babel.config.js +++ b/babel.config.js @@ -1,3 +1,3 @@ module.exports = { - presets: ['react-app'] + presets: [['react-app', { typescript: true }]] } diff --git a/conf/rollup.config.js b/conf/rollup.config.js index 05addff1c..28b246793 100644 --- a/conf/rollup.config.js +++ b/conf/rollup.config.js @@ -1,3 +1,4 @@ +import fs from 'fs' import { camelCase, upperFirst } from 'lodash' import babel from '@rollup/plugin-babel' import resolve from '@rollup/plugin-node-resolve' @@ -9,6 +10,14 @@ import visualizer from 'rollup-plugin-visualizer' const pkg = process.env.PACKAGE const isWatching = process.env.ROLLUP_WATCH === 'TRUE' +const extensions = ['.js', '.jsx', '.es6', '.es', '.mjs', '.ts', '.tsx'] +const babelConfig = { + extensions, + exclude: 'node_modules/**', + babelHelpers: 'runtime', + plugins: ['lodash'], +} + const externals = [ 'prop-types', ] @@ -23,8 +32,15 @@ const mapGlobal = name => { return name } +let input = `./packages/${pkg}/src/index.js` + +// detect TS entry index file +if (fs.existsSync(`./packages/${pkg}/src/index.ts`)) { + input = `./packages/${pkg}/src/index.ts` +} + const common = { - input: `./packages/${pkg}/src/index.js`, + input, external: id => externals.includes(id) || id.indexOf('react') === 0 || id.indexOf('d3') === 0 @@ -42,15 +58,10 @@ const commonPlugins = [ jsnext: true, main: true, browser: true, - extensions: ['.js'], + extensions, modulesOnly: true, }), - babel({ - exclude: 'node_modules/**', - babelHelpers: 'runtime', - plugins: ['lodash'], - presets: ['react-app'] - }), + babel(babelConfig), cleanup() ] diff --git a/package.json b/package.json index 291f8a29b..d522ca26e 100644 --- a/package.json +++ b/package.json @@ -62,11 +62,10 @@ "rollup-plugin-prettier": "^2.1.0", "rollup-plugin-size": "^0.2.2", "rollup-plugin-strip-banner": "^2.0.0", - "rollup-plugin-typescript2": "^0.27.1", "rollup-plugin-visualizer": "^4.2.0", "serve": "^11.2.0", - "tslint": "^6.1.2", - "typescript": "^3.9.5" + "tslint": "^6.1.3", + "typescript": "^4.0.5" }, "resolutions": { "react": "16.8.6", diff --git a/tsconfig.json b/tsconfig.json index 8eeeedb4b..23209490a 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,14 +1,22 @@ { "compilerOptions": { - "outDir": "./build", - "allowJs": true, - "target": "es2017", - "alwaysStrict": true, - "sourceMap": true, - "jsx": "react", - "moduleResolution": "node", "esModuleInterop": true, - "noImplicitAny": true + "isolatedModules": true, + "jsx": "react", + "lib": ["ESNext", "dom"], + "target": "es5", + "noEmit": true, + "noImplicitAny": true, + "noImplicitReturns": false, + "noImplicitThis": true, + "noUnusedLocals": true, + "noUnusedParameters": true, + "skipLibCheck": true, + "strict": true, + "allowJs": true, + "composite": true, + "declarationMap": true, + "moduleResolution": "node" }, "include": ["./packages/*/index.d.ts"] } diff --git a/tsconfig.monorepo.json b/tsconfig.monorepo.json new file mode 100644 index 000000000..cb88b19cf --- /dev/null +++ b/tsconfig.monorepo.json @@ -0,0 +1,20 @@ +{ + "files": [], + "references": [ + // Core first because everything needs it + // { "path": "./packages/core" }, + + // Shared next because charts need them + // { "path": "./packages/axes" }, + // { "path": "./packages/colors" }, + // { "path": "./packages/legends" }, + // { "path": "./packages/scales" }, + // { "path": "./packages/tooltip" }, + + // Utility package + // { "path": "./packages/generators" }, + + // Charts now + { "path": "./packages/pie" }, + ] +} \ No newline at end of file diff --git a/tsconfig.types.json b/tsconfig.types.json new file mode 100644 index 000000000..eb0daa6a4 --- /dev/null +++ b/tsconfig.types.json @@ -0,0 +1,8 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "declaration": true, + "emitDeclarationOnly": true, + "noEmit": false + } +}