simple-web-cli
TypeScript icon, indicating that this package has built-in type declarations

4.4.3 • Public • Published

simple-web-cli

Simple Web CLI

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

Install

   npm i simple-web-cli -D

Usage

Create

   npx sw create
  • npx sw create: prepares the environment without starting the service

Start | Watch

   npx sw
  • npx sw or npx sw start: prepares the environment and starts the service

Build

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

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 😉

Features

ES Modules to Native Browser Javascript

  • Import from external modules

    // File: ./src/index.js
    
    import { s } from 'node-and-vite-helpers';
    
    const body = s('body');
    // Output to ./dist/index.js:
    
    !function(){"use strict";var e="body";document.querySelector(e)}();
  • Import from local modules

    // File ./helpers/sum.js
    const sum = (a, b) => a + b;
    export default sum;
    
    // File: ./src/index.js
    import sum from '../helpers/sum';
    
    console.log(sum(1, 2));
    // Output to ./dist/index.js:
    
    !function(){"use strict";console.log(3)}();

Using SFTP or FTP HotSync

  • In the file .swrc.js, just insert the access infos:
SFTP FTP
{
   // ...

   sftp: {
      start: {
         root: '',
         host: '',
         username: '',
         password: '',
      },
   },
}
{
   // ...

   ftp: {
      root: '',
      host: '',
      user: '',
      pass: '',
      secure: true
   }
}
  • The sftp connection options extends all the ssh2 options
  • If the server doesn't use SSL certification, set explict or implict
  • Assuming the root option is / and the remote directory is /var/www, the input and output of the directories would be:

    • Development: ./src/ html/index.html
    • Distribution: ./dist/ html/index.html
    • Server: /var/www/ html/index.html
  • You can only use one protocol at a time: SFTP or FTP


Some Examples

View examples

HTML

INPUT

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

OUTPUT

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

HTML Import

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

CSS | Sass

INPUT

div {
   display: flex;
}

OUTPUT

div{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex}

PHP | PHTML

INPUT

<?
   $var = 'text'
?>

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

OUTPUT

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

Apache (.htaccess, php.ini)

INPUT

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

OUTPUT

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

Strings Replacement

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

.swrc.js

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

INPUT

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

OUTPUT DEV (npx sw)

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

OUTPUT BUILD (npx sw build)

<?php $_POST['456'];$site='weslley.io';
  • Works for any language that is enabled in .swrc.js

Miscellaneous Files

  • Only uploads the original file to the output directories

Compatibility

macOS Linux Windows node


License

License 3rd-Party Software License


Credits

Contributors

Contributions GitHub
Author wellwelwel
Translate en-US SrLaco
Translate Review micaele-mags

Create dev dependencies


Made with sadness and sorrow in rainy nights by Weslley Araújo 💜

Package Sidebar

Install

npm i simple-web-cli

Weekly Downloads

2

Version

4.4.3

License

MIT

Unpacked Size

93 kB

Total Files

14

Last publish

Collaborators

  • weslley.io