alighasami/vue-flow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update: rollup config

Browse Source 
* add rollup.ts
* add esbuild register to devdeps
* add rollup plugin dts to devdeps
This commit is contained in:
Braks
2021-08-08 21:00:34 +02:00
parent 156b312336
commit 2653c70334
5 changed files with 590 additions and 624 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
package.json
View File

@@ -8,12 +8,19 @@
},
"license": "MIT",
"author": "Burak Cakmakoglu",
"main": "dist/revue-flow.es.js",
"browser": "dist/revue-flow.esm.js",
"unpkg": "dist/revue-flow.global.js",
"jsdelivr": "dist/revue-flow.global.js",
"module": "dist/revue-flow.umd.js",
"types": "dist/index.d.ts",
"exports": {
".": {
"import": "./dist/revue-flow.esm.js",
"require": "./dist/revue-flow.cjs.js"
},
"./*": "./*"
},
"main": "./dist/revue-flow.cjs.js",
"types": "./dist/revue-flow.d.ts",
"module": "./dist/revue-flow.esm.js",
"unpkg": "./dist/revue-flow.iife.min.js",
"jsdelivr": "./dist/revue-flow.iife.min.js",
"sideEffects": false,
"files": [
"dist"
],
@@ -48,10 +55,10 @@
"@vitejs/plugin-vue": "^1.2.5",
"@vitejs/plugin-vue-jsx": "^1.1.6",
"@vue/babel-plugin-jsx": "^1.0.6",
"@vue/compiler-sfc": "^3.2.0-beta.5",
"@vue/eslint-config-typescript": "^7.0.0",
"autoprefixer": "^10.2.6",
"babel-eslint": "latest",
"esbuild-register": "^2.6.0",
"eslint": "^7.29.0",
"eslint-config-prettier": "^8.1.0",
"eslint-plugin-prettier": "^3.3.1",
@@ -62,17 +69,20 @@
"postcss-nested": "^5.0.5",
"prettier": "^2.2.1",
"rollup": "^2.52.2",
"rollup-plugin-dts": "^3.0.2",
"rollup-plugin-postcss": "^4.0.0",
"rollup-plugin-serve": "^1.1.0",
"rollup-plugin-svg": "^2.0.0",
"rollup-plugin-terser": "^7.0.2",
"rollup-plugin-typescript2": "^0.30.0",
"rollup-plugin-vue": "^6.0.0-beta.10",
"rollup-plugin-vue-inline-svg": "^1.1.2",
"tslib": "^2.3.0",
"typescript": "^4.3.5",
"vite": "^2.3.8",
"vite-svg-loader": "^2.1.0",
"vue": "^3.2.0-beta.5",
"vue": "^3.2.0-beta.8",
"vue-loader": "^16.4.1",
"vue-router": "4",
"vue-tsc": "^0.0.24"
},

208
rollup.config.js
View File

@@ -1,205 +1,3 @@
import path from 'path';
import ts from 'rollup-plugin-typescript2';
import replace from '@rollup/plugin-replace';
import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import pascalcase from 'pascalcase';
import pkg from './package.json';
import postcss from 'rollup-plugin-postcss';
import babel from '@rollup/plugin-babel';
import svg from 'rollup-plugin-svg';
import { DEFAULT_EXTENSIONS as DEFAULT_BABEL_EXTENSIONS } from '@babel/core';
const name = pkg.name;
function getAuthors(pkg) {
const { contributors, author } = pkg;
const authors = new Set();
if (contributors && contributors)
contributors.forEach((contributor) => {
authors.add(contributor.name);
});
if (author) authors.add(author.name);
return Array.from(authors).join(', ');
}
const banner = `/*!
* ${pkg.name} v${pkg.version}
* (c) ${new Date().getFullYear()} ${getAuthors(pkg)}
* @license MIT
*/`;
// ensure TS checks only once for each build
let hasTSChecked = false;
const outputConfigs = {
// each file name has the format: `dist/${name}.${format}.js`
// format being a key of this object
'esm-bundler': {
file: pkg.module,
format: 'es'
},
cjs: {
file: pkg.main,
format: 'cjs'
},
esm: {
file: pkg.browser,
format: 'es'
}
};
const allFormats = Object.keys(outputConfigs);
const packageFormats = allFormats;
const packageConfigs = packageFormats.map((format) => createConfig(format, outputConfigs[format]));
// only add the production ready if we are bundling the options
packageFormats.forEach((format) => {
if (format === 'cjs') {
packageConfigs.push(createProductionConfig(format));
} else if (format.startsWith('global')) {
packageConfigs.push(createMinifiedConfig(format));
}
});
export default packageConfigs;
function createConfig(format, output, plugins = []) {
if (!output) {
console.log(`invalid format: ${format}`);
process.exit(1);
}
output.exports = 'named';
output.sourcemap = !!process.env.SOURCE_MAP;
output.banner = banner;
output.externalLiveBindings = false;
output.globals = { vue: 'Vue' };
const isProductionBuild = /\.prod\.js$/.test(output.file);
const isGlobalBuild = format.startsWith('global');
const isRawESMBuild = format === 'esm';
const isNodeBuild = format === 'cjs';
const isBundlerESMBuild = /esm-bundler/.test(format);
if (isGlobalBuild) output.name = pascalcase(pkg.name);
const tsPlugin = ts({
check: !hasTSChecked,
clean: !hasTSChecked,
tsconfig: path.resolve(__dirname, 'tsconfig.json'),
cacheRoot: path.resolve(__dirname, 'node_modules/.rts2_cache'),
tsconfigOverride: {
compilerOptions: {
sourceMap: !hasTSChecked,
declaration: !hasTSChecked,
declarationMap: !hasTSChecked
},
exclude: ['__tests__', 'test-dts']
}
});
// we only need to check TS and generate declarations once for each build.
// it also seems to run into weird issues when checking multiple times
// during a single build.
hasTSChecked = true;
const external = ['vue'];
return {
input: 'src/index.ts',
// Global and Browser ESM builds inlines everything so that they can be
// used alone.
external,
plugins: [
tsPlugin,
createReplacePlugin(
isProductionBuild,
isBundlerESMBuild,
// isBrowserBuild?
isGlobalBuild || isRawESMBuild || isBundlerESMBuild,
isGlobalBuild,
isNodeBuild
),
svg(),
resolve(),
commonjs({ include: 'node_modules/**' }),
postcss({
minimize: true,
inject: true
}),
babel({
extensions: [...DEFAULT_BABEL_EXTENSIONS, '.ts', '.tsx'],
exclude: 'node_modules/**',
babelHelpers: 'inline'
}),
...plugins
],
output
// onwarn: (msg, warn) => {
// if (!/Circular/.test(msg)) {
// warn(msg)
// }
// },
};
}
function createReplacePlugin(isProduction, isBundlerESMBuild, isBrowserBuild, isGlobalBuild, isNodeBuild) {
const replacements = {
__COMMIT__: `"${process.env.COMMIT}"`,
__VERSION__: `"${pkg.version}"`,
__DEV__: isBundlerESMBuild
? // preserve to be handled by bundlers
"(process.env.NODE_ENV !== 'production')"
: // hard coded dev/prod builds
!isProduction,
// this is only used during tests
__TEST__: isBundlerESMBuild ? "(process.env.NODE_ENV === 'test')" : false,
// If the build is expected to run directly in the browser (global / esm builds)
__BROWSER__: isBrowserBuild,
// is targeting bundlers?
__BUNDLER__: isBundlerESMBuild,
__GLOBAL__: isGlobalBuild,
// is targeting Node (SSR)?
__NODE_JS__: isNodeBuild,
__ENV__: JSON.stringify(process.env.NODE_ENV),
__REVUE_FLOW_VERSION__: JSON.stringify(pkg.version),
preventAssignment: true
};
// allow inline overrides like
//__RUNTIME_COMPILE__=true yarn build
Object.keys(replacements).forEach((key) => {
if (key in process.env) {
replacements[key] = process.env[key];
}
});
return replace(replacements);
}
function createProductionConfig(format) {
return createConfig(format, {
file: `dist/${name}.${format}.prod.js`,
format: outputConfigs[format].format
});
}
function createMinifiedConfig(format) {
// eslint-disable-next-line @typescript-eslint/no-var-requires
const { terser } = require('rollup-plugin-terser');
return createConfig(
format,
{
file: `dist/${name}.${format}.prod.js`,
format: outputConfigs[format].format
},
[
terser({
module: /^esm/.test(format),
compress: {
ecma: 2015,
pure_getters: true
}
})
]
);
}
// eslint-disable-next-line @typescript-eslint/no-var-requires
require('esbuild-register');
module.exports = require('./rollup.ts');

114
rollup.ts Normal file
View File

@@ -0,0 +1,114 @@
import typescript from 'rollup-plugin-typescript2';
import { terser } from 'rollup-plugin-terser';
import dts from 'rollup-plugin-dts';
import { OutputOptions, RollupOptions } from 'rollup';
import commonjs from '@rollup/plugin-commonjs';
import resolve from '@rollup/plugin-node-resolve';
import babel from '@rollup/plugin-babel';
import vue from 'rollup-plugin-vue';
// @ts-ignore
import svg from 'rollup-plugin-svg';
import postcss from 'rollup-plugin-postcss';
// @ts-ignore
import { DEFAULT_EXTENSIONS as DEFAULT_BABEL_EXTENSIONS } from '@babel/core';
const configs: RollupOptions[] = [];
const activePackages = [
{
display: 'Revue-Flow',
external: ['@vueuse/core']
}
];
// @ts-ignore
for (const { external, iife } of activePackages) {
const iifeGlobals = {
vue: 'Vue',
'@vueuse/core': 'VueUse'
};
const iifeName = 'RevueFlow';
const functionNames = ['revue-flow'];
for (const fn of functionNames) {
const input = 'src/index.ts';
const output: OutputOptions[] = [
{
file: `dist/${fn}.cjs.js`,
format: 'cjs'
},
{
file: `dist/${fn}.esm.js`,
format: 'es'
}
];
if (iife !== false) {
output.push(
{
file: `dist/${fn}.iife.js`,
format: 'iife',
name: iifeName,
extend: true,
globals: iifeGlobals
},
{
file: `dist/${fn}.iife.min.js`,
format: 'iife',
name: iifeName,
extend: true,
globals: iifeGlobals,
plugins: [
terser({
format: {
comments: false
}
})
]
}
);
}
configs.push({
input,
output,
plugins: [
typescript({
tsconfigOverride: {
compilerOptions: {
declaration: false
}
}
}),
svg(),
resolve(),
postcss({
inject: true,
minimize: true
}),
commonjs({ include: 'node_modules/**' }),
babel({
extensions: [...DEFAULT_BABEL_EXTENSIONS, '.ts', '.tsx'],
exclude: 'node_modules/**',
babelHelpers: 'bundled'
}),
vue()
],
external: ['vue', ...(external || [])]
});
configs.push({
input,
output: {
file: `dist/${fn}.d.ts`,
format: 'es'
},
plugins: [dts()],
external: ['vue', ...(external || [])]
});
}
}
export default configs;

6
vite.config.ts
View File

@@ -8,9 +8,5 @@ export default defineConfig({
build: {
outDir: 'build'
},
plugins: [
vue(),
vueJsx(),
svgLoader()
]
plugins: [vue(), vueJsx(), svgLoader()]
});

860
yarn.lock
View File

File diff suppressed because it is too large Load Diff