build: revert changes

This commit is contained in:
David Ralph 2021-06-23 11:57:36 +01:00
parent 5d3418a8af
commit ae5a07c756
9 changed files with 95 additions and 123 deletions

1
.gitignore vendored
View File

@ -2,7 +2,6 @@
node_modules/
.vscode/
build/
dist/
# Files
package-lock.json

BIN
dist/chrome.zip vendored Normal file

Binary file not shown.

View File

@ -47,16 +47,13 @@
"source-map-loader": "^3.0.0",
"webpack": "^5.39.1",
"webpack-cli": "^4.7.2",
"webpack-dev-server": "^3.11.2",
"webpack-merge": "^5.8.0",
"zip-file-webpack-plugin": "^1.2.0"
"webpack-dev-server": "^3.11.2"
},
"scripts": {
"start": "webpack serve --config webpack.dev.js",
"build": "webpack --config webpack.prod.js",
"build:chrome": "webpack --config webpack.prod.js --env=type=chrome",
"build:firefox": "webpack --config webpack.prod.js --env=type=firefox",
"postinstall": "node -e \"if (require('fs').existsSync('node_modules/.cache/webpack')) require('fs').rmSync('node_modules/.cache/webpack', { recursive: true })\""
"start": "webpack serve",
"build": "webpack --mode=production",
"chrome": "cp manifest/chrome.json build/manifest.json",
"firefox": "cp manifest/firefox.json build/manifest.json"
},
"browserslist": {
"production": [

View File

@ -31,7 +31,7 @@ export default class Background extends React.PureComponent {
if (gradient.length > 1) {
// Note: Append the gradient for additional browser support.
const stepStyles = gradient.map((g) => ` ${g.colour} ${g.stop}%`).join();
style += ` background: ${type}-gradient(${(type === 'linear' ? (`${angle}deg,`) : '')}${stepStyles})`;
style += ` background: ${type}-gradient(${(type === 'linear' ? (`${angle}deg,`) : '')}${stepStyles});`;
}
this.setState({

View File

@ -3,11 +3,12 @@
#backgroundImage {
height: 100vh;
background-size: cover !important;
background-size: 400% 400%;
background-repeat: no-repeat !important;
background-position: center !important;
background-attachment: fixed !important;
zoom: 100% !important;
animation: gradient 15s ease infinite;
}
.backgroundPreload {
@ -35,3 +36,15 @@
opacity: 1;
}
}
@keyframes gradient {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}

View File

@ -1,44 +0,0 @@
const path = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
module.exports = {
entry: path.resolve(__dirname, './src/index.js'),
performance: {
hints: false
},
module: {
rules: [
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
use: ['babel-loader']
},
{
test: /\.(sa|sc|c)ss$/,
use: [
{
loader: MiniCssExtractPlugin.loader,
options: {
publicPath: ''
},
},
'css-loader',
'sass-loader'
],
},
{
test: /\.(woff|woff2|svg)$/,
type: 'asset/resource'
}
]
},
resolve: {
extensions: ['.js', '.jsx']
},
plugins: [
new MiniCssExtractPlugin({
filename: '[name].[chunkhash].css',
chunkFilename: '[id].[chunkhash].chunk.css'
}),
]
};

75
webpack.config.js Normal file
View File

@ -0,0 +1,75 @@
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CopyPlugin = require('copy-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
module.exports = {
entry: path.resolve(__dirname, './src/index.js'),
mode: 'development',
performance: {
hints: false
},
module: {
rules: [{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
use: ['babel-loader']
},
{
test: /\.(sa|sc|c)ss$/,
use: [
{
loader: MiniCssExtractPlugin.loader,
options: {
publicPath: ''
},
},
'css-loader',
'sass-loader'
],
},
{
test: /\.(woff|woff2|svg)$/,
type: 'asset/resource'
},
{
test: /\.js$/,
enforce: 'pre',
use: ['source-map-loader']
}]
},
resolve: {
extensions: ['.js', '.jsx']
},
output: {
path: path.resolve(__dirname, './build'),
filename: '[name].[chunkhash].js',
chunkFilename: '[id].[chunkhash].chunk.js',
clean: true
},
devServer: {
contentBase: path.resolve(__dirname, './build'),
open: true,
port: 3000
},
plugins: [
new HtmlWebpackPlugin({
template: path.resolve(__dirname, './public/index.html')
}),
new CopyPlugin({
patterns: [{
from: 'public/icons',
to: 'icons'
},
{
from: 'public/offline-images',
to: 'offline-images'
}
]
}),
new MiniCssExtractPlugin({
filename: '[name].[chunkhash].css',
chunkFilename: '[id].[chunkhash].chunk.css'
}),
]
};

View File

@ -1,21 +0,0 @@
const { merge } = require('webpack-merge');
const common = require('./webpack.common.js');
const path = require('path');
module.exports = merge(common, {
mode: 'development',
module: {
rules: [
{
test: /\.js$/,
enforce: 'pre',
use: ['source-map-loader']
}
]
},
devServer: {
contentBase: path.resolve(__dirname, './build'),
open: true,
port: 3000
}
});

View File

@ -1,47 +0,0 @@
const { merge } = require('webpack-merge');
const common = require('./webpack.common.js');
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CopyPlugin = require('copy-webpack-plugin');
const ZipFilePlugin = require('zip-file-webpack-plugin');
module.exports = (env) => {
const type = env.type || 'web';
return merge(common, {
mode: 'production',
output: {
path: path.resolve(__dirname, './build'),
filename: '[name].[chunkhash].js',
chunkFilename: '[id].[chunkhash].chunk.js',
clean: true
},
cache: {
type: 'filesystem'
},
plugins: [
new HtmlWebpackPlugin({
template: path.resolve(__dirname, './public/index.html')
}),
new CopyPlugin({
patterns: [{
from: 'public/icons',
to: 'icons'
},
{
from: 'public/offline-images',
to: 'offline-images'
},
{
from: `manifest/${type}.json`,
to: 'manifest.json'
}
]
}),
new ZipFilePlugin({
path: '../dist/',
filename: `${type}.zip`
})
]
});
}