Default liferay-npm-bundler Loaders

Several loaders are available for the liferay-npm-bundler by default. These loaders are listed below:

  • babel-loader: processes source files with Babel. This avoids an extra build step before the bundler.

  • copy-loader: copies source files (static assets) to the output folder.

  • css-loader: converts a CSS file into a JavaScript module that’s inserted into the DOM once it’s loaded.

  • json-loader: generates JavaScript modules that export the contents of a JSON file as an object. This lets you include JSON files with the require() call.

  • sass-loader: runs node-sass or sass on source files. This lets you generate static CSS files. It can be chained before style-loader.

  • style-loader: converts a CSS file into a JavaScript module that directly inserts the CSS contents into the DOM once it’s loaded. This lets you include CSS files with a require() call.

See the liferay-js-toolkit loaders showcase for an example use case of the liferay-npm-bundler’s loaders. If the default loaders don’t meet your requirements, you can follow the instructions in Creating Custom Loaders for the Bundler to create your own loaders.

« Understanding liferay-npm-bundler's LoadersCKEditor Plugin Reference Guide »
Was this article helpful?
0 out of 0 found this helpful