# @strwatcher/suipta > Simple boilerplate-code cli generator for Feature-Sliced Design methodolgy Latest version **0.1.3** (published 2023-09-11) · ISC license · 0 weekly downloads ## Install ```sh npm install @strwatcher/suipta pnpm add @strwatcher/suipta yarn add @strwatcher/suipta bun add @strwatcher/suipta ``` Provides the command `suipta`. ## Health **Score 20/100 (F)** — status: abandoned. Positive: esm support; no vulnerabilities. Warnings: low downloads; no types; pre 1.0. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 0.1.3 | | Published | 2023-09-11 | | First published | 2023-06-09 | | Weekly downloads | 0 | | License | ISC | | TypeScript types | none | | Module format | ESM + CommonJS | | Dependencies | 11 | | Unpacked size | 29.7 KB | | Known vulnerabilities | 0 (+1 in 1 direct dependencies) | | Install scripts | no | | Maintainers | strwatcher | | Keywords | fsd, boilerplate-code generator, cli, codegen | ## Links - npm: https://www.npmjs.com/package/@strwatcher/suipta - npm.io page: https://npm.io/package/@strwatcher/suipta ## Dependencies (11) - [ora](https://npm.io/package/ora.md) ^6.3.1 - [case](https://npm.io/package/case.md) ^1.6.3 - [plop](https://npm.io/package/plop.md) ^3.1.2 - [yaml](https://npm.io/package/yaml.md) ^2.2.1 - [chalk](https://npm.io/package/chalk.md) ^5.2.0 - [cmd-ts](https://npm.io/package/cmd-ts.md) ^0.12.1 - [esbuild](https://npm.io/package/esbuild.md) ^0.17.12 - [ts-node](https://npm.io/package/ts-node.md) ^10.9.1 - [minimist](https://npm.io/package/minimist.md) ^1.2.8 - [node-plop](https://npm.io/package/node-plop.md) ^0.31.1 - [@digitak/esrun](https://npm.io/package/@digitak/esrun.md) ^3.2.21 ## Alternatives - [@salesforce/cli](https://npm.io/package/@salesforce/cli.md) — 389.7K weekly downloads - [@mintlify/cli](https://npm.io/package/@mintlify/cli.md) — 208.9K weekly downloads - [@grafana/e2e-selectors](https://npm.io/package/@grafana/e2e-selectors.md) — 128.7K weekly downloads - [mintlify](https://npm.io/package/mintlify.md) — 112.0K weekly downloads - [@intlayer/cli](https://npm.io/package/@intlayer/cli.md) — 22.8K weekly downloads ## Recent versions - 0.1.3 (latest) — 2023-09-11 - 0.1.2 — 2023-06-11 - 0.1.1 — 2023-06-11 - 0.1.0 — 2023-06-09 ## README # Suipta Simple boilerplate-code cli generator intended to imporve your experience with Feature-Sliced Design methodology Based on: - [plop](https://github.com/plopjs/plop) - [cmd-ts](https://github.com/Schniz/cmd-ts) - [chalk](https://github.com/chalk/chalk) - [ora](https://github.com/sindresorhus/ora) - ...others ## How-to-use To use suipta you need one of these package managers: - npm - yarn - pnpm - volta ### Installation for npm: ```sh npm i --save-dev @strwatcher/suipta ``` for yarn: ```sh yarn add --dev @strwatcher/suipta ``` for pnpm: ```sh pnpm add -D @strwatcher/suipta ``` for volta: ```sh volta install @strwatcher/suipta ``` ### Simple Usage To use suipta with out-of-box templates you need to add it to your scripts in package.json ```json "scripts": { ... "suipta": "suipta", ... } ``` You can also add aliases for slice and segment generators: ```json "scripts": { ... "slice": "suipta slice", "segment": "suipta segment", ... } ``` After that simply start suipta from command line: - In interactive mode: ```sh pnpm suipta || pnpm slice || pnpm segment ``` - Using arguments bypassing: ```sh pnpm suipta slice entities user ``` Where: - slice is generator type (slice | segment) - entities is one of 5 preconfigured layers - user is custom name of creating slice ### Arguments If you wanna use not default settings of generators you can use arguments. (This feature works only in 'slice' generator at this moment): --ui : (react | solid) --model : (effector) --language : (js | ts) Also you can customize path to suipta config using --configPath : string ### Configuration If you need to customize behaviour of suipta you can write your own config. Default location is root dir of your project Configs that are resolving by default: - suipta.config.js - suipta.config.cjs - suipta.config.yaml - suipta.config.yml - suipta.config.json To provide typings for config you can follow this example: ```js // suipta.config.js /** * @type {import('suipta').SuiptaConfig} * **/ export default { layers: ['entities', 'features', 'widgets', 'pages'] // Array segmentLayers: ['shared'] // Array segment: ['lib', 'ui'] // Array templatesDir?: './templates' // string which is relative path (from project root dir) to templates directory lang?: 'ts' // option to choose language ('js' | 'ts') rootDir: './src' // string whic is relative path (from project root dir) to directory where results of generation will be saved } ``` ### Custom templates If you need more flexibility, you can write own templates You need to place them in templates dir and set its path to templatesDir option in config. In templates directory you need to follow next structure: ```sh templates/ ....entities/ ........files which will be use in generation ....other layer in which slice will be generated/ ........files which will be use in generation ....segments/ ........shared/ ............files which will be use in generation ........other layer in which segment will be generated/ ............files which will be use in generation ``` #### Templates format Suipta use [handlebars syntax](https://handlebarsjs.com/guide/#what-is-handlebars) to process dynamic values in templates ##### Slice generator: In templates of slice generator 2 vaiables are avaliable: - layer - slice In segment generator 3: - layer - segment - component These values can be modified using helpers: - pascalCase - camelCase - snakeCase - etc... Example of temlate file with dynamic fields: ```ts // templates/pages/ui.tsx import {PageLayout} from '...' type Props = { } export const {{pascalCase slice}}Page = (props: Props) => { return } ``` Imagine, that slice name is auth. The result of generation will be: ```ts // src/pages/auth/ui.tsx import {PageLayout} from '...' type Props = { } export const AuthPage = (props: Props) => { return } ``` ## Contributing ### Requirments: - [volta](https://volta.sh/) ### Install tooling: ```sh volta install node pnpm lefthook commitizen ``` ### Install dependencies: ```sh pnpm i ``` ### Run tests: In watch mode ```sh pnpm test ``` One time ```sh pnpm test:run ``` ### Lint code: ```sh pnpm lint ``` ### Format code: ```sh pnpm format ``` [![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/) --- _Source: https://npm.io/package/@strwatcher/suipta · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._