I rewrote the frontend in React using a module bundler. It's matched feature-for-feature with the current frontend, with only slight changes in the styling. I did not fuss about making the styling identical; the badge popup looks particularly different. This makes the front end much easier to develop. I'm really looking forward to implementing #701, to which this paves the way. This makes light use of Next.js, which provides webpack config and dev/build tooling. We’ll probably replace it with create-react-app or our own webpack setup because unfortunately it comes with a lot of runtime overhead (the build is 400k). Let’s open new issues for bugs and features, and track other follow-ups here: https://github.com/badges/shields/projects/1
27 lines
760 B
JavaScript
27 lines
760 B
JavaScript
const envFlag = require('node-env-flag');
|
|
const webpack = require('webpack');
|
|
const shouldAnalyze = envFlag(process.env.ANALYZE);
|
|
|
|
module.exports = {
|
|
webpack: config => {
|
|
config.plugins.push(new webpack.EnvironmentPlugin(['BASE_URL']));
|
|
config.plugins.push(new webpack.EnvironmentPlugin({ LONG_CACHE: null }));
|
|
|
|
if (shouldAnalyze) {
|
|
// We don't include webpack-bundle-analyzer in devDependencies, so load
|
|
// lazily.
|
|
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
|
|
config.plugins.push(new BundleAnalyzerPlugin({
|
|
analyzerMode: 'server',
|
|
analyzerPort: 8888,
|
|
openAnalyzer: true,
|
|
}));
|
|
}
|
|
|
|
return config;
|
|
},
|
|
exportPathMap: () => ({
|
|
'/': { page: '/' },
|
|
}),
|
|
};
|