aqu
v0.4.3
Published
π Powerful tool for easy typescript/javascript package development
Downloads
906
Maintainers
Readme
Inspiration
This package highly inspired by TSDX, Microbundle, Create React Library.
β¨ Features
- One dependency for your code bundling π¦
- Supports vanilla JS, TypeScript and React β
- No dealing with configurations (automatically generates CJS and esm outputs) β
- Easy project creation, build, management π§
- Supports different package managers - npm, yarn and pnpm π
- Fast, optimized builds thanks to esbuild β©
- Generates types, using common emit or dts bundle
- Supports tree shaking π
- Automatically configures ESLint, Prettier, Jest π
- Multiple entries and outputs π€ΉββοΈ
π¨ Installation
You can create new package or integrate aqu into existing package. For package creation, we recommend to install aqu globally.
π Global installation:
npm i -g aqu
Then, you can create new package:
aqu create <package>
πΎ Local installation:
npm i aqu -D
Then, add to your package.json
:
{
...
"scripts": {
"build": "aqu build",
"start": "aqu watch",
"test": "aqu test",
"lint": "aqu lint"
}
}
By default, aqu will search for index
file in src
or lib
folder (available extensions: .js
, .jsx
, .cjs
, .mjs
, .ts
, .tsx
)
If this doesn't suit for your package, you can specify source
property in your package.json
:
{
...
"source": "my/entry.js"
}
Or, if you want to specify multiple entrypoints, you can do it in aqu configuration file.
β New package
For creating new package, we recommend to install aqu globally.
In the shell, enter the command:
aqu create
Or using npx:
npx aqu create
Enter the details about your package and pick a template. Examples of generated projects you can find here
If you don't want to enter all the information, you can automatically pick all defaults, by toggling -y
flag:
npx aqu create <package> -y
β Configuration
aqu automatically creates optimal configuration for your package on-the-fly.
Default aqu configuration:
var defaultConfig = {
format: ['cjs', 'esm'], // will generate multiple outputs: one for cjs and one for esm
cjsMode: 'mixed', // will generate separate files for development and production
outdir: 'dist', // default output directory
declaration: 'bundle', // will bundle declarations using https://github.com/timocov/dts-bundle-generator
externalNodeModules: true, // automatically will mark all node_modules as external
tsconfig: 'tsconfig.json', // default path to tsconfig
incremental: true, // will build incrementally
buildOptions: {}, // custom esbuild options
watchOptions: {
// chokidar watch options
ignored: ['node_modules/**', 'dist/**', 'build/**', 'out/**'], // by default, will ignore those folders
followSymlinks: false, // will not follow symlinks
},
};
For input, aqu will search index
file inside lib
or src
folder (available extensions for index: .js
, .jsx
, .cjs
, .mjs
, .ts
, .tsx
)
Also, aqu will read your package.json
and take source
option to determine entrypoint, and name for package's name.
You can specify your own aqu configuration. By default, these files will be read inside your working directory:
aqu.config.js
aqu.config.cjs
aqu.config.mjs
aqu.config.ts
aqu.config.json
.aqurc
If your configuration has different name, you can specify --config
option for aqu. Example:
aqu build --config=myconfig.js
π Config schema
Configuration file can export one configuration, as well as array of configurations. For example:
// aqu.config.js
// this works
module.exports = {
input: './asdf.js',
};
// as well as this
module.exports = [
{
input: './asdf.js',
},
{
input: './hello.js',
},
];
Available configuration options:
- name
- input
- outdir
- outfile
- format
- cjsMode
- declaration
- tsconfig
- incremental
- externalNodeModules
- buildOptions
- watchOptions
name
type: string
Specify custom library name. By default, aqu will try to load package name from package.json
in current working directory.
input
type: string | string[]
Your library entrypoints. For each entrypoint aqu will generate output files, using this configuration. Default: index
file in src
or lib
directories.
outdir
type: string
Directory, where will all files be generaten. Default: dist
outfile
type: string
Output file. Do not works when configuration should generate multiple outputs (multiple formats or multiple entrypoints or cjsMode: "multiple"
)
format
type: Format | Format[]
Output formats. Available formats: cjs
, esm
, iife
. When cjs
format picken, configuration option cjsMode
works. Default ["cjs", "esm"]
For more information about formats, see esbuild.
cjsMode
type: "development" | "production" | "mixed"
CommonJS generation mode. Works only when format
includes cjs
. If production
- will generate minified bundle, development
- normal development build, mixed
- will generate both with one entrypoint - index.js
. Default "mixed"
declaration
type: DeclarationType
Algorithm to emit declarations. Available options - none
, normal
, bundle
. none
- do not emit declarations, normal
- default declaration emit (same as tsc does), bundle
- generate declarations bundle using dts-bundle-generator. Default bundle
.
tsconfig
type: string
Path to tsconfig. Default join(process.cwd(), "tsconfig.json")
.
incremental
type: boolean
Build incrementally. Default true
. For more information, see esbuild.
externalNodeModules
type: boolean
Should exclude node_modules packages from bundle? Default true
.
buildOptions
type: ESBuildOptions
Specify custom esbuild options.
watchOptions
type: ChokidarOptions
Specify custom chokidar watch options.
Other configurations
aqu creates default configs for ESLint, Prettier, Jest. If you don't like the defaults, you can create your own configuration and override all options.
π§ Package development
aqu makes your life easier. It automatically handles Jest, ESlint, Prettier, ESBuild and typings emit.
build
Run command to build your package.
Usage:
aqu build
watch
Watch your files and automatically rebuild project
Usage:
aqu watch
lint
Lint files using ESLint.
Usage:
aqu lint
test
Run jest. Passes all rest arguments to jest.
Usage:
aqu test.
β¨ Publishing your package
We highly recommend to use np for your package publishing.
If you have created your package using aqu create
, then you can just run:
npm run publish
Or
yarn publish
Related
- ESBuild - An extremely fast JavaScript bundler
- DTS Bundle generator - Tool to generate a single bundle of dts
- Microbundle - Zero-configuration bundler for tiny JS libs, powered by Rollup.
- TSDX - Zero-config TypeScript package development
- Create React Library - CLI for easily bootstrapping modern react libraries
License
MIT Β© Artiom Tretjakovas