antares/webpack.renderer.config.js

155 lines
4.2 KiB
JavaScript
Raw Normal View History

const fs = require('fs');
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { VueLoaderPlugin } = require('vue-loader');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const ProgressPlugin = require('progress-webpack-plugin');
const { dependencies, devDependencies, version } = require('./package.json');
const { contributors } = JSON.parse(fs.readFileSync('./.all-contributorsrc', 'utf-8'));
const parsedContributors = contributors.reduce((acc, c) => {
acc.push(c.name);
return acc;
}, []).join(',');
const externals = Object.keys(dependencies).concat(Object.keys(devDependencies));
const isDevMode = process.env.NODE_ENV === 'development';
const whiteListedModules = ['vue'];
const config = {
name: 'renderer',
mode: process.env.NODE_ENV,
devtool: isDevMode ? 'eval-source-map' : false,
entry: {
renderer: path.join(__dirname, './src/renderer/index.js')
},
target: 'electron-renderer',
output: {
libraryTarget: 'commonjs2',
path: path.resolve(__dirname, 'dist'),
filename: '[name].js',
publicPath: ''
},
node: {
global: true,
__dirname: isDevMode,
__filename: isDevMode
},
externals: externals.filter((d) => !whiteListedModules.includes(d)),
resolve: {
alias: {
vue$: 'vue/dist/vue.common.js',
common: path.resolve(__dirname, 'src/common'),
'@': path.resolve(__dirname, 'src/renderer')
},
extensions: ['', '.js', '.vue', '.json'],
fallback: {
fs: false,
path: false,
util: false,
crypto: false,
assert: false,
os: false
}
},
plugins: [
new ProgressPlugin(true),
new HtmlWebpackPlugin({
excludeChunks: ['processTaskWorker'],
filename: 'index.html',
template: path.resolve(__dirname, 'src/renderer/index.ejs'),
nodeModules: isDevMode
? path.resolve(__dirname, '../node_modules')
: false
}),
new MiniCssExtractPlugin({
filename: '[name].css',
chunkFilename: '[id].css'
}),
new VueLoaderPlugin(),
new webpack.DefinePlugin({
'process.env': {
PACKAGE_VERSION: `"${version}"`,
APP_CONTRIBUTORS: `"${parsedContributors}"`
}
})
],
module: {
rules: [
{
test: /\.js$/,
use: 'babel-loader',
exclude: /node_modules/
},
{
test: /\.node$/,
use: 'node-loader'
},
{
test: /\.vue$/,
loader: 'vue-loader'
},
{
test: /\.s(c|a)ss$/,
use: [
{ loader: MiniCssExtractPlugin.loader },
{ loader: 'css-loader' },
{
loader: 'sass-loader',
options: {
additionalData: '@import "@/scss/_variables.scss";',
sassOptions: { quietDeps: true }
}
}
]
},
{
test: /\.css$/,
use: [
{
loader: MiniCssExtractPlugin.loader,
options: {
publicPath: ''
}
},
{
loader: 'css-loader',
options: {
url: true
}
}
]
},
{
test: /\.(png|jpe?g|gif|tif?f|bmp|webp|svg)(\?.*)?$/,
type: 'asset/resource',
generator: {
filename: 'images/[hash][ext][query]'
}
},
{
test: /\.(woff|woff2|ttf|eot)$/,
type: 'asset',
parser: {
dataUrlCondition: {
maxSize: 8 * 1024
}
},
generator: {
filename: 'fonts/[hash][ext][query]'
}
}
]
}
};
if (isDevMode) {
// any dev only config
config.plugins.push(
new webpack.HotModuleReplacementPlugin()
);
}
module.exports = config;