Minify files
Category: Get StartedOrcaUI's JS and CSS files are manually minified using Terser, including 3 JS files and 1 CSS file. If users modify the source code, re-minification is required. We recommend installing Terser, which s...
Introduction
The OrcaUI project is developed in an NPM+rollup environment. Use the default npm run build command to bundle js files and npm run css to bundle css/less files, executing scripts from the script-css.js in the distribution directory.
The bundled files are placed in the dist directory, providing three module types of js files (umd, esm and cjs) and one complete css file.
Since npm run build and npm run css commands are frequently used during testing and minification is time-consuming, these four files are not minified by default during bundling.
Script Minification
The minification tool terser v5.27.2 is used for compressing scripts (Js/Ts), primarily because it supports modern JavaScript syntax. If you encounter errors while minifying OrcaUI files, try switching to terser.
Configuration parameters used:
- arguments: Convert parameter names to abbreviated forms
- dead_code: Use tree shaking to remove unused code
- directives: Remove redundant and unnecessary directives
- arrows -m: Conditionally convert functions to arrow functions
- keep_classnames=true: Preserve dependent class names
- keep_fnames=true: Preserve original function names
Style Minification
The minification tool clean-css-cli v5.6.3 is used for compressing styles (Css), mainly because it doesn't arbitrarily add extra code or remove useful code. It only removes spaces, blank lines, comments and performs abbreviation, ensuring consistent display before and after compression.
Minification Commands
js/ts and css/less files require manual minification after bundling. The command for manual minification is npm run mini, which executes the script-mini.js script in the distribution directory.