CLI
This chapter covers the VuReact command-line entry, parameters, and actual behaviors.
Commands
build [root]
One-time compilation without continuous monitoring.
bash
# By default, uses the `src` directory under the running path of the command line
npx vureact build
# Specify the input path
npx vureact build ./srcwatch [root]
After the initial full compilation, enters file monitoring and incremental recompilation.
bash
npx vureact watch
npx vureact watch ./srcConfiguration Loading and Priority
The CLI first attempts to load root/vureact.config.js, then merges command-line parameters.
Priority:
- CLI parameters
vureact.config.js- Default values
Parameters
| Parameter | Description |
|---|---|
-i, --input <dir> | Input directory (relative to root) |
-o, --outDir <dir> | Output directory name (relative to workspace) |
--workspace <dir> | Compilation workspace directory (cache + output) |
--bootstrapVite | Pre-initialize a standard React (Vite) project |
--exclude <pattern> | Exclude files/directories (glob pattern) |
--no-recursive | Disable recursive scanning of subdirectories |
--no-cache | Disable caching |
--format | Enable code formatting |
--formatter <type> | Formatter type: prettier / builtin |
Common Command Templates
1) Standard Compilation for New Projects
bash
npx vureact build -i src --workspace .vureact -o dist --format --formatter prettier2) Progressive Migration (Exclude Vue Entry)
bash
npx vureact build -i src --exclude src/main.ts --workspace .vureact -o dist3) Incremental Monitoring for Local Development
bash
npx vureact watch -i src --exclude src/main.tsWatch Mode Behavior
- Executes a full compilation once at startup.
- Monitors file changes under the
inputdirectory. .vuefiles trigger SFC compilation;.js/.tsfiles trigger script compilation; other files are copied as resource files.- Deleting files/directories will synchronously clean up output artifacts and cache records.
Key Relationships with Configuration Items
exclude: It is recommended to explicitly exclude the Vue entry file (e.g.,src/main.ts).bootstrapVite: Available for directory compilation; Vite initialization is automatically skipped for single-file input.cache: When enabled, unchanged files are skipped directly, resulting in a noticeable difference in experience in watch mode.
Common Issues
1) The command takes effect, but the output directory is not updated
First confirm:
- Whether the target file is matched by
exclude. - Whether it was skipped because the cache judged it as "unchanged".
- Whether
inputpoints to the expected directory.
2) Old artifacts remain after deleting files in watch mode
This is usually due to inconsistent mapping between the deletion path and the cache. Prioritize checking:
- Whether
root/input/outDir/workspaceare in the same path system. - Whether an external script writes back files after compilation.
- Manually delete old artifacts, or delete the entire output directory.
3) --formatter prettier does not take effect
prettier is an optional peer dependency, and the prettier package must be resolvable in the project. It is recommended to install it.
