1.0.1 • Published 2 years ago
nm_webpack_json v1.0.1
nm_webpack_json
Webpack loader to load image from Json. Work also with webmanifest file as it is JSON format.
- Compatible with webpack >5 only
- No dependency.
Getting Started
npm install -D nm_webpack_json
Then add your image under "src" key in your json. The src keys can be deep as you want in the json tree as the parser is recursive.
test.json
{
"name": "my_json",
"src" : "/img/42.png",
"icons": [
{
"name": "helloworld",
"src": "/img/helloworld.png",
}
]
}
OR
manifest.webmanifest
{
"name": "my_webmanifest",
"icons": [
{
"src": "/images/touch/homescreen48.png",
"sizes": "48x48",
"type": "image/png"
}
]
}
Then add the loader to your webpack config. For example:
webpack.config.js
module.exports = {
module: {
rules: [
{
test: /\.(png|svg|webp|jpg|jpeg)$/i,
type: 'asset/resource',
},
{
test: /\.webmanifest$/i,
use: 'nm_webpack_json',
type: 'asset/resource',
},
{
test: /\.json$/i,
use: 'nm_webpack_json',
type: 'asset/resource',
}
],
},
};
With the default options, the example above will create a [name].[hash][ext][query]
file in the output directory for the build.
Credits
This package was inspired by the webpack-webmanifest-loader