better webpack output structure and more robust path checking for cache-control
This commit is contained in:
parent
920f480a57
commit
1752b4026f
11 changed files with 86 additions and 59 deletions
|
@ -1,12 +1,30 @@
|
|||
const THREE_MONTHS_IN_SECONDS = 7776000;
|
||||
const SIX_MONTHS_IN_SECONDS = 15552000;
|
||||
|
||||
const STATIC_ASSET_PATHS = [
|
||||
'/public/font/font-v1.css',
|
||||
'/public/font/v1/300.woff',
|
||||
'/public/font/v1/300i.woff',
|
||||
'/public/font/v1/400.woff',
|
||||
'/public/font/v1/400i.woff',
|
||||
'/public/font/v1/700.woff',
|
||||
'/public/font/v1/700i.woff',
|
||||
'/public/favicon.png',
|
||||
'/public/img/busy.gif',
|
||||
'/public/img/gerbil-happy.png',
|
||||
'/public/img/gerbil-sad.png',
|
||||
'/public/img/placeholder.png',
|
||||
'/public/img/thumbnail-broken.png',
|
||||
'/public/img/thumbnail-missing.png',
|
||||
'/public/img/total-background.png',
|
||||
];
|
||||
|
||||
async function redirectMiddleware(ctx, next) {
|
||||
const {
|
||||
request: { url },
|
||||
} = ctx;
|
||||
|
||||
if (url.includes('.png') || url.includes('font.css') || url.includes('.woff')) {
|
||||
ctx.set('Cache-Control', `public, max-age=${THREE_MONTHS_IN_SECONDS}`);
|
||||
if (STATIC_ASSET_PATHS.includes(url)) {
|
||||
ctx.set('Cache-Control', `public, max-age=${SIX_MONTHS_IN_SECONDS}`);
|
||||
}
|
||||
|
||||
return next();
|
||||
|
|
|
@ -17,8 +17,8 @@ const webConfig = {
|
|||
},
|
||||
output: {
|
||||
filename: '[name].js',
|
||||
path: __dirname + '/dist/',
|
||||
publicPath: '/',
|
||||
path: __dirname + '/dist/public/',
|
||||
publicPath: '/public/',
|
||||
},
|
||||
devServer: {
|
||||
port: WEBPACK_WEB_PORT,
|
||||
|
@ -62,15 +62,15 @@ const webConfig = {
|
|||
},
|
||||
{
|
||||
from: `${STATIC_ROOT}/img/favicon.png`,
|
||||
to: `${DIST_ROOT}/favicon.png`,
|
||||
to: `${DIST_ROOT}/public/favicon.png`,
|
||||
},
|
||||
{
|
||||
from: `${STATIC_ROOT}/img/og.png`,
|
||||
to: `${DIST_ROOT}/og.png`,
|
||||
to: `${DIST_ROOT}/public/og.png`,
|
||||
},
|
||||
{
|
||||
from: `${STATIC_ROOT}/font/`,
|
||||
to: `${DIST_ROOT}/font/`,
|
||||
to: `${DIST_ROOT}/public/font/`,
|
||||
},
|
||||
]),
|
||||
new DefinePlugin({
|
||||
|
|
|
@ -1,47 +0,0 @@
|
|||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
font-display: swap;
|
||||
src: url('/font/inter/300.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 300;
|
||||
font-display: swap;
|
||||
src: url('/font/inter/300i.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url('/font/inter/400.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url('/font/inter/400i.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: url('/font/inter/700.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: url('/font/inter/700i.woff') format('woff');
|
||||
}
|
|
@ -2,9 +2,65 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<script src="/ui.js" async></script>
|
||||
<link rel="icon" type="image/png" href="favicon.png" />
|
||||
<link rel="stylesheet" href="/font/font.css" />
|
||||
<script src="/public/ui.js" async></script>
|
||||
<link rel="icon" type="image/png" href="/public/favicon.png" />
|
||||
|
||||
<link rel="preload" href="public/font/v1/300.woff" as="font" type="font/woff" />
|
||||
<link rel="preload" href="public/font/v1/300i.woff" as="font" type="font/woff" />
|
||||
<link rel="preload" href="public/font/v1/400.woff" as="font" type="font/woff" />
|
||||
<link rel="preload" href="public/font/v1/400i.woff" as="font" type="font/woff" />
|
||||
<link rel="preload" href="public/font/v1/700.woff" as="font" type="font/woff" />
|
||||
<link rel="preload" href="public/font/v1/700i.woff" as="font" type="font/woff" />
|
||||
|
||||
<style>
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
font-display: swap;
|
||||
src: url('/public/font/v1/300.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 300;
|
||||
font-display: swap;
|
||||
src: url('/public/font/v1/300i.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url('/public/font/v1/400.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url('/public/font/v1/400i.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: url('/public/font/v1/700.woff') format('woff');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Inter';
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: url('/public/font/v1/700i.woff') format('woff');
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- VARIABLE_HEAD_BEGIN -->
|
||||
<title>lbry.tv</title>
|
||||
|
|
|
@ -47,7 +47,7 @@ let baseConfig = {
|
|||
use: {
|
||||
loader: 'file-loader',
|
||||
options: {
|
||||
outputPath: 'static/img',
|
||||
outputPath: 'img/',
|
||||
name: '[name].[ext]',
|
||||
},
|
||||
},
|
||||
|
|
Loading…
Reference in a new issue