refactor: tweaks to webpack config

This commit is contained in:
abhijithvijayan 2020-01-27 19:35:15 +05:30
parent 64042691cc
commit 0ff115769c

View File

@ -13,6 +13,8 @@ const FixStyleOnlyEntriesPlugin = require('webpack-fix-style-only-entries');
const manifestInput = require('./src/manifest'); const manifestInput = require('./src/manifest');
const viewsPath = path.join(__dirname, 'views'); const viewsPath = path.join(__dirname, 'views');
const sourcePath = path.join(__dirname, 'src');
const destPath = path.join(__dirname, 'extension');
const nodeEnv = process.env.NODE_ENV || 'development'; const nodeEnv = process.env.NODE_ENV || 'development';
const targetBrowser = process.env.TARGET_BROWSER; const targetBrowser = process.env.TARGET_BROWSER;
const manifest = wextManifest[targetBrowser](manifestInput); const manifest = wextManifest[targetBrowser](manifestInput);
@ -37,6 +39,7 @@ const getExtensionFileType = browser => {
if (browser === 'opera') { if (browser === 'opera') {
return 'crx'; return 'crx';
} }
if (browser === 'firefox') { if (browser === 'firefox') {
return 'xpi'; return 'xpi';
} }
@ -52,12 +55,12 @@ module.exports = {
contentScript: './src/scripts/contentScript.js', contentScript: './src/scripts/contentScript.js',
popup: './src/scripts/popup.js', popup: './src/scripts/popup.js',
options: './src/scripts/options.js', options: './src/scripts/options.js',
styles: ['./src/styles/popup.scss', './src/styles/options.scss'], styles: [path.join(sourcePath, 'Popup', 'popup.scss'), path.join(sourcePath, 'Options', 'options.scss')],
}, },
output: { output: {
filename: 'js/[name].bundle.js', filename: 'js/[name].bundle.js',
path: path.resolve(__dirname, 'extension', targetBrowser), path: path.join(destPath, targetBrowser),
}, },
module: { module: {
@ -115,8 +118,10 @@ module.exports = {
plugins: [ plugins: [
new webpack.ProgressPlugin(), new webpack.ProgressPlugin(),
// https://github.com/webpack-contrib/extract-text-webpack-plugin/issues/518
new FixStyleOnlyEntriesPlugin({ silent: true }), new FixStyleOnlyEntriesPlugin({ silent: true }),
new webpack.EnvironmentPlugin(['NODE_ENV', 'TARGET_BROWSER']), new webpack.EnvironmentPlugin(['NODE_ENV', 'TARGET_BROWSER']),
// delete previous build files
new CleanWebpackPlugin({ new CleanWebpackPlugin({
cleanOnceBeforeBuildPatterns: [ cleanOnceBeforeBuildPatterns: [
path.join(process.cwd(), `extension/${targetBrowser}`), path.join(process.cwd(), `extension/${targetBrowser}`),
@ -137,8 +142,11 @@ module.exports = {
chunks: ['options'], chunks: ['options'],
filename: 'options.html', filename: 'options.html',
}), }),
// copy assets
new CopyWebpackPlugin([{ from: 'src/assets', to: 'assets' }]), new CopyWebpackPlugin([{ from: 'src/assets', to: 'assets' }]),
// write manifest.json
new WriteWebpackPlugin([{ name: manifest.name, data: Buffer.from(manifest.content) }]), new WriteWebpackPlugin([{ name: manifest.name, data: Buffer.from(manifest.content) }]),
// plugin to enable browser reloading in development mode
extensionReloaderPlugin, extensionReloaderPlugin,
], ],
@ -149,14 +157,10 @@ module.exports = {
parallel: true, parallel: true,
}), }),
new ZipPlugin({ new ZipPlugin({
path: path.resolve(__dirname, 'extension'), path: destPath,
extension: `${getExtensionFileType(targetBrowser)}`, extension: `${getExtensionFileType(targetBrowser)}`,
filename: `${targetBrowser}`, filename: `${targetBrowser}`,
}), }),
], ],
}, },
devServer: {
contentBase: path.join(__dirname, 'extension'),
},
}; };