wetw

library0.1.2jsnpmunverified

wetw is a command-line interface (CLI) tool for generating and managing UI components, drawing inspiration from `shadcn-ui`. It facilitates the direct copying of template files into your project, allowing for easy customization and deep integration. Currently stable at version `0.1.2`, it is part of the actively developed `weapp-tailwindcss` monorepo, which focuses on providing robust Tailwind CSS integration for mini-program environments. wetw receives frequent updates, often alongside improvements to the core `weapp-tailwindcss` ecosystem. Key features include configurable output directories, support for various mini-program frameworks like `mp-weixin`, `uni-app-vue3`, and `taro-react`, and the ability to define component registries via local JSON files or remote URLs. Components are generated with inline Tailwind CSS utility classes, eliminating the need for separate style files and promoting a utility-first CSS approach tailored for mini-program development.

web-framework devops

npm install wetw

github ↗package ↗

INSTALL

IMPORT

SIG · WETW

wetw

web-frameworkjavascriptv0.1.2

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

defineConfig

✓ import { defineConfig } from 'wetw'

✗ const defineConfig = require('wetw').defineConfig

wetw is primarily an ESM package. Use named imports for configuration functions.

Demonstrates initializing the configuration, listing available components, and adding a component using the wetw CLI.

import { defineConfig } from 'wetw'; // wetw.config.ts export default defineConfig({ outDir: 'src/components/wetw-ui', // Specify where generated components will be placed framework: 'mp-weixin', // Choose your target mini-program framework (e.g., 'mp-weixin', 'uni-app-vue3', 'taro-react') // Optionally, specify a custom registry URL or local path for component templates. // By default, it uses an official online registry. // registry: 'https://tw.icebreaker.top/wetw/registry.json', // templatesRoot: './my-templates', // If using a local registry, define the root for relative template paths }); // --- CLI Usage --- // Install wetw as a dev dependency: // pnpm add -D wetw // 1. Initialize the wetw.config.ts file in your project root: // pnpm exec wetw init // 2. List available components from the configured registry: // pnpm exec wetw list // 3. Add a component (e.g., 'counter') to your project: // pnpm exec wetw add counter // The 'counter' component files will be generated in the 'src/components/wetw-ui/counter' directory.

wetw --version

Debug

Known issues

breakingThe `wetw` CLI requires Node.js version `^20.19.0` or `>=22.12.0`. Older Node.js versions are not supported and may lead to installation or runtime errors.

fix

Upgrade your Node.js environment to a supported version (e.g., using `nvm install 20` or `nvm install 22`).

affects: <=0.1.x

gotchaWhen adding components, `wetw` will not overwrite existing files by default. If a component with the same name already exists in the target `outDir`, the command will fail.

fix

To force overwrite existing files, append the `--force` flag to the `wetw add` command: `wetw add <name...> --force`.

affects: >=0.0.1

gotchaThe `framework` option in `wetw.config.ts` (`mp-weixin`, `uni-app-vue3`, `taro-react`) must accurately reflect your project's target framework to ensure correct component generation and compatibility.

fix

Verify that `framework` in `wetw.config.ts` matches your project setup. Incorrect settings can lead to template errors or unusable components.

affects: >=0.0.1

gotchaWhile `wetw` generates components with Tailwind CSS utility classes, it does not set up Tailwind CSS in your project. Your project must already have a working Tailwind CSS integration configured for the generated styles to take effect.

fix

Ensure you have `tailwindcss` and its PostCSS integration properly set up in your mini-program project. Refer to the `weapp-tailwindcss` documentation for framework-specific setup guides.

affects: >=0.0.1

Errors

Common errors & fixes

Command 'wetw' not found

`wetw` is a CLI tool, and it's either not installed or not accessible in your PATH.

fix

If installed as a dev dependency, use `pnpm exec wetw`, `npx wetw`, or `yarn wetw`. If not installed, run `pnpm add -D wetw` or `npm install -D wetw`.

Error: Component 'my-custom-component' not found in registry.

The component name provided to `wetw add` does not exist in the configured registry, or the registry path is incorrect.

fix

Run `wetw list` to see available components. Check your `wetw.config.ts` to ensure the `registry` path is correct and accessible (local file or remote URL).

Error: Failed to load config file 'wetw.config.ts': ...

The `wetw.config.ts` file is either missing, has a syntax error, or is not in the expected location.

fix

Ensure `wetw.config.ts` exists in your project root or specify its path with `--config`. Review the file for syntax errors and correct `defineConfig` usage.

Files for component 'counter' already exist. Use --force to overwrite.

You attempted to add a component that already has corresponding files in your `outDir` without explicitly allowing an overwrite.

fix

If you intend to update or replace the existing component files, re-run the command with the `--force` flag: `wetw add counter --force`.

Upgrade

Version history

0.1.2latest on npm

Audit

Dependencies

tailwindcssrequiredGenerated components rely on Tailwind CSS utility classes for styling. While wetw generates the code, a Tailwind CSS setup is required in the target project for styles to render correctly.

Agent activity

14 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/sonofmagic/weapp-tailwindcss ↗

packagehttps://www.npmjs.com/package/wetw ↗