README
JS Output to File Webpack Plugin
Lightweight webpack plugin that takes in a JS file and writes its output into a file.
Useful for generating files like manifest.json.
Installation
yarn add --dev js-output-file-webpack-plugin
or
npm i --save-dev js-output-file-webpack-plugin
Usage
In webpack.config.js
:
const JSOutputFilePlugin = require('js-output-file-webpack-plugin');
const config = {
context: path.join(__dirname, 'src'),
output: {
path: path.join(__dirname, 'dist')
},
plugins: [
new JSOutputFilePlugin({
source: 'manifest.json.js'
})
]
};
module.exports = config;
In src/manifest.json.js
:
const pkg = require('./package.json');
module.exports = env => {
const manifest = {
name: 'Example manifest',
// use some dynamically generated variables
version: pkg.version,
icons: {
'16': 'icons/icon16.png',
'48': 'icons/icon48.png',
'128': 'icons/icon128.png'
},
background: {
scripts: ['bg.js'],
persistent: false
}
};
// environment specific rendering
if (env === 'development') {
manifest['content_security_policy'] =
"script-src 'self' 'unsafe-eval'; object-src 'self'";
}
return manifest;
};
JSOutputFilePlugin
will output a file of the same name in output directory, with the .js
extension stripped.
Running the webpack compiler will yield dist/manifest.json
:
// Prettified for example purposes.
// Actual JSON output will be minified unless the return value is a string.
{
"name": "Example manifest",
"version": "2.0.1",
"icons": {
"16": "icons/icon16.png",
"48": "icons/icon48.png",
"128": "icons/icon128.png"
},
"background": {
"scripts": [
"bg.js"
],
"persistent": false
},
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'"
}