andras/schmelczer-dev
1
0
Fork 0
Code Issues Pull requests 6 Projects Releases Packages Wiki Activity Actions

Fix lagging

Browse source
This commit is contained in:
Schmelczer András 2020-01-04 10:25:10 +01:00
commit f054546aa6
35 changed files with 497 additions and 494 deletions
Download patch file Download diff file Expand all files Collapse all files

143
webpack.config.js
View file

@ -1,157 +1,158 @@
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const { CleanWebpackPlugin } = require("clean-webpack-plugin");
const TerserJSPlugin = require("terser-webpack-plugin");
const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const HtmlWebpackInlineSourcePlugin = require("html-webpack-inline-source-plugin");
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const TerserJSPlugin = require('terser-webpack-plugin');
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const HtmlWebpackInlineSourcePlugin = require('html-webpack-inline-source-plugin');
const isProduction = process.env.NODE_ENV === "production";
const isProduction = process.env.NODE_ENV === 'production';
module.exports = {
watchOptions: {
ignored: /node_modules/
ignored: /node_modules/,
},
devServer: {
host: "0.0.0.0"
host: '0.0.0.0',
// disableHostCheck: true
},
optimization: {
minimizer: [new TerserJSPlugin({}), new OptimizeCSSAssetsPlugin({})]
minimizer: [new TerserJSPlugin({}), new OptimizeCSSAssetsPlugin({})],
},
plugins: [
new CleanWebpackPlugin(),
new HtmlWebpackPlugin({
xhtml: true,
minify: true,
template: "./src/index.html",
inlineSource: ".(js|css)$"
template: './src/index.html',
inlineSource: '.(js|css)$',
}),
new HtmlWebpackInlineSourcePlugin(),
new MiniCssExtractPlugin({
filename: "[name].[contenthash].css",
chunkFilename: "[id].[contenthash].css"
})
filename: '[name].[contenthash].css',
chunkFilename: '[id].[contenthash].css',
}),
],
entry: {
index: "./src/index.ts"
index: './src/index.ts',
},
module: {
rules: [
{
test: /\.(jpe?g|png)$/i,
loader: "responsive-loader",
loader: 'responsive-loader',
options: {
adapter: require("responsive-loader/sharp"),
outputPath: "static/",
adapter: require('responsive-loader/sharp'),
outputPath: 'static/',
sizes: [300, 600, 1200, 2000],
placeholder: false
}
placeholder: false,
},
},
{
test: /\.(webm|mp4)$/i,
use: [
{
loader: "file-loader",
loader: 'file-loader',
query: {
outputPath: "static/"
}
outputPath: 'static/',
},
},
{
loader: "image-webpack-loader",
loader: 'image-webpack-loader',
options: {
disable: !isProduction,
mozjpeg: {
progressive: true,
quality: 65
quality: 65,
},
optipng: {
enabled: true
enabled: true,
},
pngquant: {
quality: [0.65, 0.9],
speed: 4
speed: 4,
},
gifsicle: {
interlaced: false
interlaced: false,
},
webp: {
quality: 65
}
}
}
]
quality: 65,
},
},
},
],
},
{
test: /\.svg$/,
loader: "svg-url-loader",
loader: 'svg-url-loader',
options: {
limit: 10 * 1024,
noquotes: true
}
noquotes: true,
},
},
{
test: /\.(pdf)$/i,
use: {
loader: "file-loader",
loader: 'file-loader',
query: {
outputPath: "static/",
name: "[name].[ext]"
}
}
outputPath: 'static/',
name: '[name].[ext]',
},
},
},
{
test: /\.ico$/i,
use: {
loader: "file-loader",
loader: 'file-loader',
query: {
outputPath: "/",
name: "[name].[ext]"
}
}
outputPath: '/',
name: '[name].[ext]',
},
},
},
{
test: /\.scss$/i,
use: [
MiniCssExtractPlugin.loader,
"css-loader",
"postcss-loader",
'css-loader',
'postcss-loader',
{
loader: "resolve-url-loader",
loader: 'resolve-url-loader',
options: {
keepQuery: true
}
keepQuery: true,
},
},
{
loader: "sass-loader",
loader: 'sass-loader',
options: {
sourceMap: true
}
}
]
sourceMap: true,
},
},
],
},
{
test: /\.(woff2?|ttf|eot|svg)(?:[?#].+)?$/,
use: {
loader: "file-loader",
loader: 'file-loader',
options: {
name: "[name].[ext]",
outputPath: "static/fonts/"
}
name: '[name].[ext]',
outputPath: 'static/fonts/',
},
},
include: /fonts/
include: /fonts/,
},
{
test: /\.ts$/,
use: "ts-loader",
exclude: /node_modules/
}
]
use: 'ts-loader',
exclude: /node_modules/,
},
],
},
resolve: {
extensions: [".ts", ".js"]
extensions: ['.ts', '.js'],
},
output: {
filename: "[name].[contenthash].js",
path: path.resolve(__dirname, "dist")
}
filename: '[name].[contenthash].js',
path: path.resolve(__dirname, 'dist'),
},
};