Webpack integration

Find out how to integrate JSQL with Webpack

Stack requirements

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

Of course, to use the plugin for Webpack, your project must use the Webpack as tasks runner.


Install JSQL Webpack plugin into your frontend project using NPM:

npm install jsql-webpack --save-dev

Once the plugin has been installed, it may be enabled inside your webpack.config.js with this line of JavaScript:

var jsqlWebpackPlugin = require("jsql-webpack");

Task configuration

The plugin requires an API_KEY and src as a directory or input file and dist as the output directory:

    plugins: [
new jsqlWebpackPlugin(
apiKey: '==iSqF8rKvVeSgqudKDOXpjiFgGMJh1PbeouIz9IW/YQ==9CI8ox66gogpoSXm6yrU',
src: 'scr',
dist: 'dist',
watcher: ''

List of configuration parameters:

apiKey(String): your working application key from JSQL Admin Panel. See FAQ for details

src(String): file or input directory with files that will be processed


src: 'app.js'
src: 'src'
src: 'src/*.js'
src: 'src/app.js'

dist(String): output directory where processed files will be saved


dist: 'output'
dist: 'build'

Developer key

The plugin requires the file with the developer key which must be found in the directory in which webpack.config.js is.

This file can be downloaded from the JSQL Admin 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).


Due to the multitude of configurations, we recommend only that the jsql task be connected to the process of building the application and under the process of observing changes (watcher).

Errors handling

In case of any errors the information will be shown in red in standard output (console).

Detailed information will be added to debug/jsql-debug-[timeStamp].txt file.

What next?

Close Menu