Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
feat(terser): update to terser v5 and use its esm build
  • Loading branch information
adamdbradley committed Aug 14, 2020
1 parent 5d53630 commit 4b67c5a
Show file tree
Hide file tree
Showing 13 changed files with 160 additions and 100 deletions.
17 changes: 14 additions & 3 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Expand Up @@ -111,7 +111,7 @@
"semiver": "^1.1.0",
"semver": "7.3.2",
"sizzle": "^2.3.5",
"terser": "4.8.0",
"terser": "5.1.0",
"tslib": "^2.0.0",
"typescript": "4.0.0-beta",
"webpack": "^4.44.1",
Expand Down
22 changes: 10 additions & 12 deletions scripts/bundles/compiler.ts
Expand Up @@ -13,10 +13,11 @@ import { replacePlugin } from './plugins/replace-plugin';
import { sizzlePlugin } from './plugins/sizzle-plugin';
import { sysModulesPlugin } from './plugins/sys-modules-plugin';
import { writePkgJson } from '../utils/write-pkg-json';
import { BuildOptions } from '../utils/options';
import { RollupOptions, OutputChunk } from 'rollup';
import type { BuildOptions } from '../utils/options';
import type { RollupOptions, OutputChunk } from 'rollup';
import { typescriptSourcePlugin } from './plugins/typescript-source-plugin';
import terser from 'terser';
import { MinifyOptions, minify } from 'terser';
import { terserPlugin } from './plugins/terser-plugin';

export async function compiler(opts: BuildOptions) {
const inputDir = join(opts.buildDir, 'compiler');
Expand Down Expand Up @@ -56,6 +57,7 @@ export async function compiler(opts: BuildOptions) {
},
plugins: [
typescriptSourcePlugin(opts),
terserPlugin(opts),
{
name: 'compilerMockDocResolvePlugin',
resolveId(id) {
Expand Down Expand Up @@ -115,7 +117,7 @@ export async function compiler(opts: BuildOptions) {
if (opts.isProd) {
const compilerFilename = Object.keys(bundleFiles).find(f => f.includes('stencil'));
const compilerBundle = bundleFiles[compilerFilename] as OutputChunk;
const minified = minifyStencilCompiler(compilerBundle.code, opts);
const minified = await minifyStencilCompiler(compilerBundle.code, opts);
await fs.writeFile(join(opts.output.compilerDir, compilerFilename.replace('.js', '.min.js')), minified);
}
},
Expand All @@ -142,8 +144,8 @@ export async function compiler(opts: BuildOptions) {
return [compilerBundle];
}

function minifyStencilCompiler(code: string, opts: BuildOptions) {
const minifyOpts: terser.MinifyOptions = {
async function minifyStencilCompiler(code: string, opts: BuildOptions) {
const minifyOpts: MinifyOptions = {
ecma: 2018,
compress: {
ecma: 2018,
Expand All @@ -152,17 +154,13 @@ function minifyStencilCompiler(code: string, opts: BuildOptions) {
unsafe_arrows: true,
unsafe_methods: true,
},
output: {
format: {
ecma: 2018,
comments: false,
},
};

const results = terser.minify(code, minifyOpts);

if (results.error) {
throw results.error;
}
const results = await minify(code, minifyOpts);

code = getBanner(opts, `Stencil Compiler`, true) + '\n' + results.code;

Expand Down
15 changes: 6 additions & 9 deletions scripts/bundles/dev-server.ts
Expand Up @@ -7,9 +7,9 @@ import { aliasPlugin } from './plugins/alias-plugin';
import { relativePathPlugin } from './plugins/relative-path-plugin';
import { replacePlugin } from './plugins/replace-plugin';
import { writePkgJson } from '../utils/write-pkg-json';
import { BuildOptions } from '../utils/options';
import { RollupOptions, OutputChunk, Plugin } from 'rollup';
import terser from 'terser';
import type { BuildOptions } from '../utils/options';
import type { RollupOptions, OutputChunk, Plugin } from 'rollup';
import { minify } from 'terser';
import ts from 'typescript';
import { prettyMinifyPlugin } from './plugins/pretty-minify';

Expand Down Expand Up @@ -145,7 +145,7 @@ export async function devServer(opts: BuildOptions) {
appErrorCssPlugin(),
{
name: 'clientConnectorPlugin',
generateBundle(_options, bundle) {
async generateBundle(_options, bundle) {
if (bundle[connectorName]) {
let code = (bundle[connectorName] as OutputChunk).code;

Expand All @@ -164,13 +164,10 @@ export async function devServer(opts: BuildOptions) {
code = intro + code + outro;

if (opts.isProd) {
const minifyResults = terser.minify(code, {
const minifyResults = await minify(code, {
compress: { hoist_vars: true, hoist_funs: true, ecma: 5 },
output: { ecma: 5 },
format: { ecma: 5 },
});
if (minifyResults.error) {
throw minifyResults.error;
}
code = minifyResults.code;
}

Expand Down
4 changes: 2 additions & 2 deletions scripts/bundles/internal-platform-client.ts
@@ -1,6 +1,6 @@
import fs from 'fs-extra';
import { basename, join } from 'path';
import { BuildOptions } from '../utils/options';
import type { BuildOptions } from '../utils/options';
import { aliasPlugin } from './plugins/alias-plugin';
import { replacePlugin } from './plugins/replace-plugin';
import { reorderCoreStatementsPlugin } from './plugins/reorder-statements';
Expand Down Expand Up @@ -114,7 +114,7 @@ export async function internalClient(opts: BuildOptions) {
let code = transpileToEs5.outputText;

if (opts.isProd) {
const minifyResults = minify(code);
const minifyResults = await minify(code);
code = minifyResults.code;
}

Expand Down
12 changes: 4 additions & 8 deletions scripts/bundles/plugins/parse5-plugin.ts
@@ -1,11 +1,11 @@
import fs from 'fs-extra';
import { aliasPlugin } from './alias-plugin';
import { join } from 'path';
import { BuildOptions } from '../../utils/options';
import type { BuildOptions } from '../../utils/options';
import rollupCommonjs from '@rollup/plugin-commonjs';
import rollupResolve from '@rollup/plugin-node-resolve';
import { rollup, OutputChunk, Plugin } from 'rollup';
import terser from 'terser';
import { minify } from 'terser';

export function parse5Plugin(opts: BuildOptions): Plugin {
return {
Expand Down Expand Up @@ -77,22 +77,18 @@ async function bundleParse5(opts: BuildOptions) {
let code = output[0].code;

if (opts.isProd) {
const minified = terser.minify(code, {
const minified = await minify(code, {
ecma: 2018,
module: true,
compress: {
ecma: 2018,
passes: 2,
},
output: {
format: {
ecma: 2018,
comments: false,
},
});

if (minified.error) {
throw minified.error;
}
code = minified.code;
}

Expand Down
33 changes: 16 additions & 17 deletions scripts/bundles/plugins/pretty-minify.ts
@@ -1,26 +1,25 @@
import { BuildOptions } from '../../utils/options';
import { Plugin, OutputChunk } from 'rollup';
import terser from 'terser';
import type { BuildOptions } from '../../utils/options';
import type { Plugin, OutputChunk } from 'rollup';
import { minify } from 'terser';

export function prettyMinifyPlugin(opts: BuildOptions, preamble?: string): Plugin {
if (opts.isProd) {
return {
name: 'prettyMinifyPlugin',
generateBundle(_, bundles) {
Object.keys(bundles).forEach(fileName => {
const b = bundles[fileName] as OutputChunk;
if (typeof b.code === 'string') {
const minifyResults = terser.minify(b.code, {
compress: { hoist_vars: true, hoist_funs: true, ecma: 2018, keep_fnames: true, keep_classnames: true, module: true, arrows: true, passes: 2 },
output: { ecma: 2018, indent_level: 1, beautify: true, comments: false, preamble },
sourceMap: false,
});
if (minifyResults.error) {
throw minifyResults.error;
async generateBundle(_, bundles) {
await Promise.all(
Object.keys(bundles).map(async fileName => {
const b = bundles[fileName] as OutputChunk;
if (typeof b.code === 'string') {
const minifyResults = await minify(b.code, {
compress: { hoist_vars: true, hoist_funs: true, ecma: 2018, keep_fnames: true, keep_classnames: true, module: true, arrows: true, passes: 2 },
format: { ecma: 2018, indent_level: 1, beautify: true, comments: false, preamble },
sourceMap: false,
});
b.code = minifyResults.code;
}
b.code = minifyResults.code;
}
});
}),
);
},
};
}
Expand Down
64 changes: 64 additions & 0 deletions scripts/bundles/plugins/terser-plugin.ts
@@ -0,0 +1,64 @@
import fs from 'fs-extra';
import { join } from 'path';
import type { BuildOptions } from '../../utils/options';
import { rollup, Plugin } from 'rollup';
import { minify } from 'terser';

export function terserPlugin(opts: BuildOptions): Plugin {
return {
name: 'terserPlugin',
resolveId(id) {
if (id === 'terser') {
return id;
}
return null;
},
async load(id) {
if (id === 'terser') {
return await bundleTerser(opts);
}
return null;
},
};
}

async function bundleTerser(opts: BuildOptions) {
const fileName = `terser-${opts.terserVersion.replace(/\./g, '_')}-bundle-cache${opts.isProd ? '.min' : ''}.js`;
const cacheFile = join(opts.scriptsBuildDir, fileName);

try {
return await fs.readFile(cacheFile, 'utf8');
} catch (e) {}

const rollupBuild = await rollup({
input: join(opts.nodeModulesDir, 'terser', 'main.js'),
external: ['source-map'],
});

const { output } = await rollupBuild.generate({
format: 'es',
preferConst: true,
strict: false,
});

let code = output[0].code;

if (opts.isProd) {
const minified = await minify(code, {
ecma: 2018,
compress: {
ecma: 2018,
passes: 2,
},
format: {
ecma: 2018,
comments: false,
},
});
code = minified.code;
}

await fs.writeFile(cacheFile, code);

return code;
}
14 changes: 5 additions & 9 deletions scripts/bundles/plugins/typescript-source-plugin.ts
@@ -1,8 +1,8 @@
import fs from 'fs-extra';
import { Plugin } from 'rollup';
import type { Plugin } from 'rollup';
import { join } from 'path';
import { BuildOptions } from '../../utils/options';
import terser from 'terser';
import type { BuildOptions } from '../../utils/options';
import { minify } from 'terser';

export function typescriptSourcePlugin(opts: BuildOptions): Plugin {
const tsPath = require.resolve('typescript');
Expand Down Expand Up @@ -73,22 +73,18 @@ async function bundleTypeScriptSource(tsPath: string, opts: BuildOptions) {
code = o.join('\n');

if (opts.isProd) {
const minified = terser.minify(code, {
const minified = await minify(code, {
ecma: 2018,
module: true,
compress: {
ecma: 2018,
passes: 2,
},
output: {
format: {
ecma: 2018,
comments: false,
},
});

if (minified.error) {
throw minified.error;
}
code = minified.code;
}

Expand Down
15 changes: 8 additions & 7 deletions scripts/bundles/sys-node.ts
@@ -1,11 +1,11 @@
import fs from 'fs-extra';
import { join } from 'path';
import webpack from 'webpack';
import terser from 'terser';
import { minify } from 'terser';
import rollupCommonjs from '@rollup/plugin-commonjs';
import rollupResolve from '@rollup/plugin-node-resolve';
import { BuildOptions } from '../utils/options';
import { RollupOptions } from 'rollup';
import type { BuildOptions } from '../utils/options';
import type { RollupOptions } from 'rollup';
import { relativePathPlugin } from './plugins/relative-path-plugin';
import { aliasPlugin } from './plugins/alias-plugin';
import { prettyMinifyPlugin } from './plugins/pretty-minify';
Expand Down Expand Up @@ -191,12 +191,13 @@ function bundleExternal(opts: BuildOptions, outputDir: string, cachedDir: string
let code = await fs.readFile(outputFile, 'utf8');

if (opts.isProd) {
const minifyResults = terser.minify(code);
if (minifyResults.error) {
rejectBundle(minifyResults.error);
try {
const minifyResults = await minify(code);
code = minifyResults.code;
} catch (e) {
rejectBundle(e);
return;
}
code = minifyResults.code;
}
await fs.writeFile(cachedFile, code);
await fs.writeFile(outputFile, code);
Expand Down
2 changes: 0 additions & 2 deletions src/compiler/config/validate-config.ts
Expand Up @@ -47,8 +47,6 @@ export const validateConfig = (userConfig?: Config) => {
setBooleanConfig(config, 'minifyJs', null, !config.devMode);
setBooleanConfig(config, 'sourceMap', null, false);
setBooleanConfig(config, 'watch', 'watch', false);
setBooleanConfig(config, 'minifyCss', null, !config.devMode);
setBooleanConfig(config, 'minifyJs', null, !config.devMode);
setBooleanConfig(config, 'buildDocs', 'docs', !config.devMode);
setBooleanConfig(config, 'buildDist', 'esm', !config.devMode || config.buildEs5);
setBooleanConfig(config, 'profile', 'profile', config.devMode);
Expand Down

0 comments on commit 4b67c5a

Please sign in to comment.