fbpx

CLI for building with JSQL

Find out how to use JSQL CLI for building and watching files changes

Stack requirements

The JSQL CLI plugin will not work without an account in the JSQL cloud. To learn more see overview.

Of course, to use the CLI you need JavaScript scripts to be processed.

Installation

Install JSQL CLI  globally into your system using NPM:
npm install -g jsql-cli
Once the CLI has been installed, it may be available inside bash/cmd console:
jsql-cli --version

Basic usage

Basic usage of JSQL CLI with single file hashing:

jsql-cli --apiKey=YOUR_API_KEY --input=dist/app.js --output=dist/app.js

File mask

What if your framework like React or Vue produce output js file with hash like main.d3t54s.min.js? How to hash it when always changing name?

Use […] skipping parameter

jsql-cli --apiKey=YOUR_API_KEY --input=dist/main[...]min.js --output=dist/main[...]min.js

Rename developer key

By default, developer key is stored in jsql.key file. If you change the name of file, you need to tell about it to CLI passing additional parameter devKeyFileName

jsql-cli --apiKey=YOUR_API_KEY --input=app.js --output=app.js --devKeyFileName=my-key.txt

 

Watching changes

JSQL CLI allows you to observe changes in the directory, thanks to which you can query queries on the fly

jsql-cli --apiKey=YOUR_API_KEY --input=/src/**/*.js --watch

If you need to watch files with multiple extensions, you can use:

jsql-cli --apiKey=YOUR_API_KEY --input=/src/**/*.* --extensions=js,vue --watch

Warning! Watcher does not build a directory into the file, it only hashes queries into JSQL Cloud, so it should be used only with enabled option Disable hashing for development mode

Developer key

The plugin requires the file with the developer key which must be found in the project directory.

This file can be downloaded from the JSQL Customer Panel by each team member (see how to download it in FAQ) and saved locally in the project.

We recommend that the file with the development key be added to the ignored files with the repository used (GIT, SVN etc).

Help

Type help to get information about the input parameters.
jsql-cli --help

Example integration with Vue and JSQL CLI in package.json

This example needs concurrently module to be installed.

This example needs Disable hashing for development mode option enabled in security options.

"scripts": {
  "serve": "concurrently --kill-others \"vue-cli-service serve\" \"npm run jsql-watch\"",
  "jsql-watch": "jsql-cli --apiKey=(..) --input=/src/**/*.* --extensions=js,vue --watch",
  "jsql-build": "jsql-cli --apiKey=(..) --devKey=(..) --output=/dist/js/app.js --input=/dist/js/app.js",
  "build": "vue-cli-service build && npm run jsql-build"
}

Example integration with React and JSQL CLI in package.json

This example needs concurrently module to be installed.

This example needs Disable hashing for development mode option enabled in security options.

"scripts": {
"serve": "concurrently --kill-others \"react-scripts start\" \"npm run jsql-watch\"",
"jsql-watch": "jsql-cli --apiKey=(..) --input=/src/**/*.js --watch",
"jsql-build": "jsql-cli --apiKey=(..) --devKey=(..) --output=/build/static/js/main.[...].chunk.js --input=/build/static/js/main.[...].chunk.js",
"build": "react-scripts build && npm run jsql-build"
}

Example integration with Angular 7 and JSQL CLI in package.json

This example needs concurrently module to be installed.

This example needs Disable hashing for development mode option enabled in security options.

"scripts": {
"serve": "concurrently --kill-others \"ng serve\" \"npm run jsql-watch\"",
"jsql-watch": "jsql-cli --apiKey=(..) --input=/src/app/**/*.* --extensions=ts --watch",
"jsql-build": "jsql-cli --apiKey=(..) --devKey=(..) --output=/dist/main[...].js --input=/dist/main[...].js",
"build": "ng build --prod && npm run jsql-build",
}

Debug

When CLI does not work and you can not find a reason or a fatal error occurs, you can view more information using the debug parameter alongside with other parameters.

jsql-cli --debug

Errors handling

In case of any errors the information will be shown in console.

What next?

Close Menu