allow building of only specfic languages,
english is not a required locale anymore
This commit is contained in:
parent
872c3a5659
commit
3aad00dca7
|
@ -258,9 +258,16 @@ Run `npm run lint:src` to check for code errors and warnings or `npm run lint --
|
||||||
|
|
||||||
[ttag](https://github.com/ttag-org/ttag/) is used for handling translations. For server-side rendering the `Accept-Language` header gets checked and the first locale used and on-the-fly translated (`src/core/ttag.js` provides the functions for it). On the client-side a seperate bundle for every language gets provided.
|
[ttag](https://github.com/ttag-org/ttag/) is used for handling translations. For server-side rendering the `Accept-Language` header gets checked and the first locale used and on-the-fly translated (`src/core/ttag.js` provides the functions for it). On the client-side a seperate bundle for every language gets provided.
|
||||||
The language definitions in `i18n/template.pot` and `i18n/template-ssr.pot` get updated when doing a dev build with
|
The language definitions in `i18n/template.pot` and `i18n/template-ssr.pot` get updated when doing a dev build with
|
||||||
|
|
||||||
```
|
```
|
||||||
npm run build:dev
|
npm run build:dev
|
||||||
```
|
```
|
||||||
which also only builds the default local in a development environment for debugging.
|
which also only builds the default local in a development environment for debugging.
|
||||||
|
|
||||||
|
To build only specific languages, you can define them with the `--langs` flag:
|
||||||
|
|
||||||
|
```
|
||||||
|
npm run build -- --langs de,tr
|
||||||
|
```
|
||||||
|
|
||||||
You can use `npm run babel-node ./utils/script.js` to execute a script with local babel (path always relative to the root directory).
|
You can use `npm run babel-node ./utils/script.js` to execute a script with local babel (path always relative to the root directory).
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
"description": "Unlimited planet canvas for placing pixels",
|
"description": "Unlimited planet canvas for placing pixels",
|
||||||
"main": "server.js",
|
"main": "server.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"build": "node scripts/build.js && npm run minify-css",
|
"build": "node scripts/build.js",
|
||||||
"build:dev": "webpack --env extract --config ./webpack.config.server.js && webpack --env extract --env development --config ./webpack.config.client.js && npm run minify-css",
|
"build:dev": "webpack --env extract --config ./webpack.config.server.js && webpack --env extract --env development --config ./webpack.config.client.js && npm run minify-css",
|
||||||
"deploy": "ssh pixelplanet /home/pixelpla/rebuild.sh",
|
"deploy": "ssh pixelplanet /home/pixelpla/rebuild.sh",
|
||||||
"minify-css": "node scripts/minifyCss.js",
|
"minify-css": "node scripts/minifyCss.js",
|
||||||
|
|
|
@ -6,10 +6,21 @@
|
||||||
const path = require('path');
|
const path = require('path');
|
||||||
const fs = require('fs');
|
const fs = require('fs');
|
||||||
const webpack = require('webpack');
|
const webpack = require('webpack');
|
||||||
|
|
||||||
|
const minifyCss = require('./minifyCss');
|
||||||
const serverConfig = require('../webpack.config.server.js');
|
const serverConfig = require('../webpack.config.server.js');
|
||||||
const clientConfig = require('../webpack.config.client.js');
|
const clientConfig = require('../webpack.config.client.js');
|
||||||
const { getAllAvailableLocals } = clientConfig;
|
const { getAllAvailableLocals } = clientConfig;
|
||||||
|
|
||||||
|
let langs = 'all';
|
||||||
|
for (let i = 0; i < process.argv.length; i += 1) {
|
||||||
|
if (process.argv[i] == '--langs') {
|
||||||
|
const newLangs = process.argv[++i];
|
||||||
|
if (newLangs) langs = newLangs;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function compile(webpackConfig) {
|
function compile(webpackConfig) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
webpack(webpackConfig).run((err, stats) => {
|
webpack(webpackConfig).run((err, stats) => {
|
||||||
|
@ -27,6 +38,20 @@ async function buildProduction() {
|
||||||
// cleanup old files
|
// cleanup old files
|
||||||
fs.rmSync(path.resolve(__dirname, '..', 'node_modules', '.cache', 'webpack'), { recursive: true, force: true });
|
fs.rmSync(path.resolve(__dirname, '..', 'node_modules', '.cache', 'webpack'), { recursive: true, force: true });
|
||||||
// fs.rmSync(path.resolve(__dirname, '..', 'dist', 'public', 'assets'), { recursive: true, force: true });
|
// fs.rmSync(path.resolve(__dirname, '..', 'dist', 'public', 'assets'), { recursive: true, force: true });
|
||||||
|
|
||||||
|
// decide which languages to build
|
||||||
|
let avlangs = getAllAvailableLocals();
|
||||||
|
if (langs !== 'all') {
|
||||||
|
avlangs = langs.split(',').map((l) => l.trim())
|
||||||
|
.filter((l) => avlangs.includes(l));
|
||||||
|
if (!avlangs.length) {
|
||||||
|
console.error(`ERROR: language ${langs} not available`);
|
||||||
|
process.exit(1);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
console.log('Building locales:', avlangs);
|
||||||
|
|
||||||
// server files
|
// server files
|
||||||
console.log('-----------------------------');
|
console.log('-----------------------------');
|
||||||
console.log(`Build server...`);
|
console.log(`Build server...`);
|
||||||
|
@ -35,12 +60,11 @@ async function buildProduction() {
|
||||||
development: false,
|
development: false,
|
||||||
extract: false,
|
extract: false,
|
||||||
}));
|
}));
|
||||||
|
|
||||||
// client files
|
// client files
|
||||||
const langs = getAllAvailableLocals();
|
|
||||||
console.log('Available locales:', langs);
|
|
||||||
const st = Date.now();
|
const st = Date.now();
|
||||||
for(let i = 0; i < langs.length; i += 1) {
|
for(let i = 0; i < avlangs.length; i += 1) {
|
||||||
const lang = langs[i];
|
const lang = avlangs[i];
|
||||||
console.log(`Build client for locale ${lang}...`);
|
console.log(`Build client for locale ${lang}...`);
|
||||||
console.log('-----------------------------');
|
console.log('-----------------------------');
|
||||||
await compile(clientConfig({
|
await compile(clientConfig({
|
||||||
|
@ -52,6 +76,7 @@ async function buildProduction() {
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
console.log(`Finished building in ${(Date.now() - st) / 1000}s`);
|
console.log(`Finished building in ${(Date.now() - st) / 1000}s`);
|
||||||
|
await minifyCss();
|
||||||
}
|
}
|
||||||
|
|
||||||
buildProduction();
|
buildProduction();
|
||||||
|
|
|
@ -81,6 +81,14 @@ function checkAssets() {
|
||||||
// eslint-disable-next-line prefer-const
|
// eslint-disable-next-line prefer-const
|
||||||
assets = checkAssets();
|
assets = checkAssets();
|
||||||
|
|
||||||
|
export function getLangsOfJsAsset(name) {
|
||||||
|
const nameAssets = assets.js[name];
|
||||||
|
if (!nameAssets) {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
return Object.keys(nameAssets);
|
||||||
|
}
|
||||||
|
|
||||||
export function getJsAssets(name, lang) {
|
export function getJsAssets(name, lang) {
|
||||||
const jsAssets = [];
|
const jsAssets = [];
|
||||||
|
|
||||||
|
|
|
@ -5,29 +5,36 @@ import { TTag } from 'ttag';
|
||||||
import cookie from 'cookie';
|
import cookie from 'cookie';
|
||||||
|
|
||||||
import { languageFromLocalisation } from '../utils/location';
|
import { languageFromLocalisation } from '../utils/location';
|
||||||
|
import { getLangsOfJsAsset } from './assets';
|
||||||
|
|
||||||
// eslint-disable-next-line max-len
|
// eslint-disable-next-line max-len
|
||||||
const localeImports = require.context('../../i18n', false, /^\.[/\\]ssr-.+\.po$/);
|
const localeImports = require.context('../../i18n', false, /^\.[/\\]ssr-.+\.po$/);
|
||||||
|
|
||||||
const ttags = {
|
const ttags = {};
|
||||||
en: new TTag(),
|
|
||||||
};
|
|
||||||
|
|
||||||
(() => {
|
(() => {
|
||||||
const langs = localeImports.keys();
|
const langs = localeImports.keys();
|
||||||
|
const jsLangs = getLangsOfJsAsset('client');
|
||||||
|
|
||||||
|
if (jsLangs.includes('en')) {
|
||||||
|
ttags.en = new TTag();
|
||||||
|
}
|
||||||
|
|
||||||
for (let i = 0; i < langs.length; i += 1) {
|
for (let i = 0; i < langs.length; i += 1) {
|
||||||
const file = langs[i];
|
const file = langs[i];
|
||||||
const ttag = new TTag();
|
|
||||||
// ./ssr-de.po
|
// ./ssr-de.po
|
||||||
const lang = file.replace('./ssr-', '').replace('.po', '');
|
const lang = file.replace('./ssr-', '').replace('.po', '').toLowerCase();
|
||||||
ttag.addLocale(lang, localeImports(file).default);
|
if (jsLangs.includes(lang)) {
|
||||||
ttag.useLocale(lang);
|
const ttag = new TTag();
|
||||||
ttags[lang] = ttag;
|
ttag.addLocale(lang, localeImports(file).default);
|
||||||
|
ttag.useLocale(lang);
|
||||||
|
ttags[lang] = ttag;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})();
|
})();
|
||||||
|
|
||||||
export function getTTag(lang) {
|
export function getTTag(lang) {
|
||||||
return ttags[lang] || ttags.en;
|
return ttags[lang] || ttags.en || Object.values(ttags)[0];
|
||||||
}
|
}
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|
@ -38,8 +45,16 @@ export function getTTag(lang) {
|
||||||
export function expressTTag(req, res, next) {
|
export function expressTTag(req, res, next) {
|
||||||
const cookies = cookie.parse(req.headers.cookie || '');
|
const cookies = cookie.parse(req.headers.cookie || '');
|
||||||
const language = cookies.plang || req.headers['accept-language'];
|
const language = cookies.plang || req.headers['accept-language'];
|
||||||
req.lang = languageFromLocalisation(language);
|
let lang = languageFromLocalisation(language);
|
||||||
req.ttag = getTTag(req.lang);
|
if (!ttags[lang]) {
|
||||||
|
if (ttags.en) {
|
||||||
|
lang = 'en';
|
||||||
|
} else {
|
||||||
|
[lang] = Object.keys(ttags);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
req.lang = lang;
|
||||||
|
req.ttag = ttags[lang];
|
||||||
next();
|
next();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -74,7 +74,7 @@ router.get('/globe', (req, res) => {
|
||||||
const { html, etag: globeEtag } = generateGlobePage(req);
|
const { html, etag: globeEtag } = generateGlobePage(req);
|
||||||
|
|
||||||
res.set({
|
res.set({
|
||||||
'Cache-Control': `private, no-cache`, // seconds
|
'Cache-Control': 'private, no-cache', // seconds
|
||||||
ETag: globeEtag,
|
ETag: globeEtag,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -101,7 +101,7 @@ router.use(
|
||||||
const { html, etag: winEtag } = generatePopUpPage(req);
|
const { html, etag: winEtag } = generatePopUpPage(req);
|
||||||
|
|
||||||
res.set({
|
res.set({
|
||||||
'Cache-Control': `private, no-cache`, // seconds
|
'Cache-Control': 'private, no-cache', // seconds
|
||||||
ETag: winEtag,
|
ETag: winEtag,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -122,7 +122,7 @@ router.get('/', (req, res) => {
|
||||||
const { html, csp, etag: mainEtag } = generateMainPage(req);
|
const { html, csp, etag: mainEtag } = generateMainPage(req);
|
||||||
|
|
||||||
res.set({
|
res.set({
|
||||||
'Cache-Control': `private, no-cache`, // seconds
|
'Cache-Control': 'private, no-cache', // seconds
|
||||||
'Content-Security-Policy': csp,
|
'Content-Security-Policy': csp,
|
||||||
ETag: mainEtag,
|
ETag: mainEtag,
|
||||||
});
|
});
|
||||||
|
|
|
@ -17,7 +17,6 @@ import { getHostFromRequest } from '../utils/ip';
|
||||||
* generate language list
|
* generate language list
|
||||||
*/
|
*/
|
||||||
const langs = Object.keys(ttags)
|
const langs = Object.keys(ttags)
|
||||||
.map((l) => (l === 'default' ? 'en' : l))
|
|
||||||
.map((l) => [l, langCodeToCC(l)]);
|
.map((l) => [l, langCodeToCC(l)]);
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|
|
|
@ -17,7 +17,6 @@ import { getHostFromRequest } from '../utils/ip';
|
||||||
* generate language list
|
* generate language list
|
||||||
*/
|
*/
|
||||||
const langs = Object.keys(ttags)
|
const langs = Object.keys(ttags)
|
||||||
.map((l) => (l === 'default' ? 'en' : l))
|
|
||||||
.map((l) => [l, langCodeToCC(l)]);
|
.map((l) => [l, langCodeToCC(l)]);
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|
|
Loading…
Reference in New Issue
Block a user