Several loaders are available for the liferay-npm-bundler by default:
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, so you can 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 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.