# simple-web-cli

> ⚡ A simple compiler to automate the development in HTML, CSS, SCSS, JavaScript, TypeScript and PHP languages, focused on Shared Hosts and using SFTP or FTP to deploy files processed automatically to final server.

Latest version **4.4.8** (published 2026-02-16) · MIT license · 0 weekly downloads

## Install

```sh
npm install simple-web-cli
pnpm add simple-web-cli
yarn add simple-web-cli
bun add simple-web-cli
```

Provides the commands `sw`, `simple-web`, `simple-web-cli`.

## Health

**Score 65/100 (B)** — status: stable.

Positive: has types; esm support; no vulnerabilities; has provenance; high quality score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 4.4.8 |
| Published | 2026-02-16 |
| First published | 2021-11-17 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | >=16.0.0 |
| Dependencies | 8 |
| Unpacked size | 91.8 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| Provenance | attested (Unknown) |
| GitHub stars | 5 |
| Author | https://github.com/wellwelwel |
| Maintainers | weslley.io |
| Keywords | ftp, ftps, sftp, watch, watcher, import, modules, browser, dom, automation, hotsync, sync, build, bundle, compiler, pipeline |

## Links

- npm: https://www.npmjs.com/package/simple-web-cli
- Repository: https://github.com/wellwelwel/simple-web-cli
- Homepage: https://github.com/wellwelwel/simple-web-cli#readme
- Issues: https://github.com/wellwelwel/simple-web-cli/issues
- npm.io page: https://npm.io/package/simple-web-cli

## Dependencies (8)

- [madge](https://npm.io/package/madge.md) ^8.0.0
- [archiver](https://npm.io/package/archiver.md) ^7.0.1
- [draftlog](https://npm.io/package/draftlog.md) ^1.0.13
- [basic-ftp](https://npm.io/package/basic-ftp.md) ^5.1.0
- [uglifycss](https://npm.io/package/uglifycss.md) ^0.0.29
- [basic-sftp](https://npm.io/package/basic-sftp.md) ^0.1.2
- [node-watch](https://npm.io/package/node-watch.md) ^0.7.4
- [html-minifier-next](https://npm.io/package/html-minifier-next.md) ^5.1.1

## Alternatives

- [raw-loader](https://npm.io/package/raw-loader.md) — 4.3M weekly downloads
- [plop](https://npm.io/package/plop.md) — 1.4M weekly downloads
- [webpack-deadcode-plugin](https://npm.io/package/webpack-deadcode-plugin.md) — 80.3K weekly downloads
- [@storybook/preact-vite](https://npm.io/package/@storybook/preact-vite.md) — 54.2K weekly downloads
- [vite-plugin-transform](https://npm.io/package/vite-plugin-transform.md) — 2.4K weekly downloads

## Recent versions

- 4.4.8 (latest) — 2026-02-16
- 3.0.0-beta (beta) — 2022-01-08
- 2.0.23-test (local-modules-tests) — 2021-11-17
- 4.4.7 — 2026-02-16
- 4.4.6 — 2026-02-16
- 4.4.5 — 2026-02-16
- 4.4.4 — 2026-02-16
- 4.4.3 — 2023-05-16
- 4.4.2 — 2023-05-16
- 4.4.1 — 2023-05-16
- 4.4.0 — 2023-05-16
- 4.3.2 — 2023-04-08
- 4.3.1 — 2023-01-12
- 4.3.0 — 2023-01-12
- 4.2.0 — 2023-01-09
- … 81 more at https://npm.io/package/simple-web-cli/versions

## README

<p align="center">
 <img width="100px" src="/.github/assets/readme/logo.svg" align="center" alt="simple-web-cli" />
 <h1 align="center">Simple Web CLI</h1>
 <p align="center">⚡ A simple compiler to automate the development in <code><b>HTML</b></code>, <code><b>CSS | SCSS</b></code>, <code><b>JS | TS</b></code> and <code><b>PHP</b></code> languages, focused on <b>Shared Hosts</b> and using <b>SFTP</b> or <b>FTP</b> to deploy files processed automatically to final server.</p>
</p>

## Install

```shell
   npm i simple-web-cli -D
```

<hr>

### Usage

#### Create

```shell
   npx sw create
```

- `npx sw create`: prepares the environment without starting the service

#### Start | Watch

```shell
   npx sw
```

- `npx sw` or `npx sw start`: prepares the environment and starts the service

#### Build

```shell
   npx sw build
```

- `npx sw build`: compiles the contents from `src` and zips it to `release.zip`

<hr />

### Development

- **`src`** is the default directory of development to watch
- **`dist`** is the default directory with the compiled code
- Once the process is started, the event occurs by **saving any file** into `src`.
- All options are preconfigured and you can customize them 😉

<hr />

### <img src="/.github/assets/readme/logo.svg" width="20" /> Features

#### ES Modules to Native Browser Javascript

##### Import from external modules

```javascript
// File: ./src/index.js

import { s } from 'node-and-vite-helpers';

const body = s('body');
```

<!-- prettier-ignore -->
   >
   >    ```javascript
   >    // Output to ./dist/index.js:
   >
   >    !function(){"use strict";var e="body";document.querySelector(e)}();
   >    ```

##### Import from local modules

```javascript
// File: ./src/index.js
import sum from '../helpers/sum';

// File ./helpers/sum.js
const sum = (a, b) => a + b;
export default sum;

console.log(sum(1, 2));
```

<!-- prettier-ignore -->
   >
   >    ```javascript
   >    // Output to ./dist/index.js:
   >
   >    !function(){"use strict";console.log(3)}();
   >    ```

<hr />

#### Using SFTP or FTP HotSync

- In the file **`.swrc.js`**, just insert the access infos:

<table width="100%">
<tr>
<td>SFTP</td>
<td>FTP</td>
</tr>
<tr>
<td>

```javascript
{
   // ...

   sftp: {
      start: {
         root: '',
         host: '',
         username: '',
         password: '',
      },
   },
}
```

</td>
<td>

```javascript
{
   // ...

   ftp: {
      root: '',
      host: '',
      user: '',
      pass: '',
      secure: true
   }
}
```

</td>
</tr>
<tr>
<td>

- The [`sftp`](https://github.com/wellwelwel/basic-sftp) connection options extends all the [`ssh2`](https://github.com/mscdex/ssh2) options

</td>
<td>

- If the server doesn't use SSL certification, set `explict` or `implict`

</td>
</tr>
</table>

- Assuming the **`root`** option is `/` and the _remote directory_ is `/var/www`, the input and output of the directories would be:
  - **Development:** <ins>`./src/`</ins> <b>`html/index.html`</b>
  - **Distribution:** <ins>`./dist/`</ins> <b>`html/index.html`</b>
  - **Server:** <ins>`/var/www/`</ins> <b>`html/index.html`</b>

- You can only use one protocol at a time: `SFTP` or `FTP`

<hr />

### <img src="/.github/assets/readme/logo.svg" width="20" /> Some Examples

<details>
<summary>View examples</summary>

#### HTML

`INPUT`

```html
<div>
  <h1>Title</h1>
  <p>Paragraph</p>
</div>
```

`OUTPUT`

<!-- prettier-ignore -->
   ```html
   <div><h1>Title</h1><p>Paragraph</p></div>
   ```

<hr />

#### HTML Import

- You can import `.html` files recursively, based on the `scss` import, for example:
  ```html
  <html>
    <body>
      <!-- import('./views/_header.html') -->
      <section>
        <!-- import('./views/_main.html') -->
      </section>
      <!-- import('../_footer.html') -->
    </body>
  </html>
  ```

<hr />

#### CSS | Sass

`INPUT`

```css
div {
  display: flex;
}
```

`OUTPUT`

<!-- prettier-ignore -->
   ```css
   div{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex}
   ```

<hr />

#### PHP | PHTML

`INPUT`

```php
<?
   $var = 'text'
?>

<div>
   <?=$var?>
</div>
```

`OUTPUT`

```php
<?php $var='text'?><div><?=$var?></div>
```

<hr />

#### Apache (.htaccess, php.ini)

`INPUT`

```apache
# comment
<Directory /var/www/>
   # another comment
   Options Indexes FollowSymLinks MultiViews
</Directory>
```

`OUTPUT`

```apache
<Directory /var/www/>
Options Indexes FollowSymLinks MultiViews
</Directory>
```

<hr />

#### Strings Replacement

- You can create an easy to read code and on compiling, replace the specified strings, for example:

<ins>`.swrc.js`</ins>

```javascript
{
   strings: {
      '*token*': {
         start: '123',
         build: '456'
      },
      '*site-name*': {
         start: 'dev.weslley.io',
         build: 'weslley.io'
      }
   }
}
```

`INPUT`

```php
<?
   $_POST['*token*'];
   $site = '*site-name*';
```

`OUTPUT DEV (npx sw)`

```php
<?php $_POST['123'];$site='dev.weslley.io';
```

`OUTPUT BUILD (npx sw build)`

```php
<?php $_POST['456'];$site='weslley.io';
```

- Works for any language that is enabled in `.swrc.js`
<hr />

#### Miscellaneous Files

- Only uploads the original file to the output directories
</details>
<hr />

### Compatibility

![macOS](/.github/assets/readme/macos.svg)
![Linux](/.github/assets/readme/linux.svg)
![Windows](/.github/assets/readme/windows.svg)
![node](/.github/assets/readme/node.svg)

<hr />

### License

[![License](/.github/assets/readme/license.svg)](/LICENSE)

<hr />

### Credits

#### Contributors

| Contributions    | GitHub                                                                                          |
| ---------------- | ----------------------------------------------------------------------------------------------- |
| Author           | [![wellwelwel](/.github/assets/readme/author.svg)](https://github.com/wellwelwel)               |
| Translate en-US  | [![SrLaco](/.github/assets/readme/translate.svg)](https://github.com/SrLaco)                    |
| Translate Review | [![micaele-mags](/.github/assets/readme/translate-review.svg)](https://github.com/micaele-mags) |

<hr />

#### `Create` dev dependencies

- [@babel/preset-env](https://babel.dev/docs/en/next/babel-preset-env)
- [@rollup/plugin-babel](https://github.com/rollup/plugins/tree/master/packages/babel#readme)
- [@rollup/plugin-commonjs](https://github.com/rollup/plugins/tree/master/packages/commonjs/#readme)
- [@rollup/plugin-node-resolve](https://github.com/rollup/plugins/tree/master/packages/node-resolve/#readme)
- [@rollup/plugin-terser](https://github.com/rollup/plugins/tree/master/packages/terser#readme)
- [@rollup/plugin-typescript](https://github.com/rollup/plugins/tree/master/packages/typescript/#readme)
- [@types/ssh2](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/ssh2)
- [autoprefixer](https://github.com/postcss/autoprefixer#readme)
- [node-and-vite-helpers](https://github.com/wellwelwel/node-and-vite-helpers#readme)
- [packages-update](https://github.com/wellwelwel/packages-update#readme)
- [postcss-cli](https://github.com/postcss/postcss-cli#readme)
- [rollup](https://rollupjs.org/)
- [sass](https://github.com/sass/dart-sass)
- [tslib](https://www.typescriptlang.org)
- [typescript](https://www.typescriptlang.org)
- [uglify-js](https://github.com/mishoo/UglifyJS#readme)

<hr />

<p>

**Made with _sadness_ and _sorrow_ in rainy nights by [Weslley Araújo](https://github.com/wellwelwel)** 💜

</p>

---
_Source: https://npm.io/package/simple-web-cli · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._