wip #313
This commit is contained in:
syuilo
parent
4e387cf7d0
commit
abb8e021ba
7 changed files with 112 additions and 77 deletions
33
gulpfile.ts
33
gulpfile.ts
|
|
@ -2,6 +2,7 @@
|
|||
* Gulp tasks
|
||||
*/
|
||||
|
||||
import * as childProcess from 'child_process';
|
||||
import * as fs from 'fs';
|
||||
import * as Path from 'path';
|
||||
import * as gulp from 'gulp';
|
||||
|
|
@ -10,7 +11,6 @@ import * as ts from 'gulp-typescript';
|
|||
import tslint from 'gulp-tslint';
|
||||
import * as glob from 'glob';
|
||||
import * as es from 'event-stream';
|
||||
import * as webpack from 'webpack-stream';
|
||||
import cssnano = require('gulp-cssnano');
|
||||
//import * as uglify from 'gulp-uglify';
|
||||
import pug = require('gulp-pug');
|
||||
|
|
@ -123,21 +123,25 @@ gulp.task('cleanall', ['clean'], cb =>
|
|||
gulp.task('default', ['build']);
|
||||
|
||||
gulp.task('build:client', [
|
||||
'build:ts', 'build:js',
|
||||
'build:client:scripts',
|
||||
'build:ts',
|
||||
'build:js',
|
||||
'webpack',
|
||||
'build:client:script',
|
||||
'build:client:pug',
|
||||
'copy:client'
|
||||
]);
|
||||
|
||||
gulp.task('build:client:scripts', () =>
|
||||
es.merge(
|
||||
webpack(require('./webpack.config'), require('webpack'))
|
||||
.pipe(gulp.dest('./built/web/assets/')) as any,
|
||||
gulp.src('./src/web/app/client/script.js')
|
||||
.pipe(replace('VERSION', JSON.stringify(version)))
|
||||
//.pipe(isProduction ? uglify() : gutil.noop())
|
||||
.pipe(gulp.dest('./built/web/assets/client/')) as any
|
||||
)
|
||||
gulp.task('webpack', done => {
|
||||
const output = childProcess.execSync(Path.join('.', 'node_modules', '.bin', 'webpack') + ' --config webpack.config.ts', );
|
||||
console.log(output.toString());
|
||||
done();
|
||||
});
|
||||
|
||||
gulp.task('build:client:script', () =>
|
||||
gulp.src('./src/web/app/client/script.js')
|
||||
.pipe(replace('VERSION', JSON.stringify(version)))
|
||||
//.pipe(isProduction ? uglify() : gutil.noop())
|
||||
.pipe(gulp.dest('./built/web/assets/client/')) as any
|
||||
);
|
||||
|
||||
gulp.task('build:client:styles', () =>
|
||||
|
|
@ -149,7 +153,8 @@ gulp.task('build:client:styles', () =>
|
|||
);
|
||||
|
||||
gulp.task('copy:client', [
|
||||
'build:client:scripts'
|
||||
'build:client:script',
|
||||
'webpack'
|
||||
], () =>
|
||||
gulp.src([
|
||||
'./assets/**/*',
|
||||
|
|
@ -165,7 +170,7 @@ gulp.task('copy:client', [
|
|||
|
||||
gulp.task('build:client:pug', [
|
||||
'copy:client',
|
||||
'build:client:scripts',
|
||||
'build:client:script',
|
||||
'build:client:styles'
|
||||
], () =>
|
||||
gulp.src('./src/web/app/*/view.pug')
|
||||
|
|
|
|||
3
locales/en.json
Normal file
3
locales/en.json
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"home": "Home"
|
||||
}
|
||||
3
locales/ja.json
Normal file
3
locales/ja.json
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"home": "ホーム"
|
||||
}
|
||||
|
|
@ -144,7 +144,6 @@
|
|||
"uuid": "3.0.1",
|
||||
"vhost": "3.0.2",
|
||||
"webpack": "2.3.1",
|
||||
"webpack-stream": "3.2.0",
|
||||
"websocket": "1.0.24",
|
||||
"whatwg-fetch": "2.0.3",
|
||||
"xml2json": "0.11.0"
|
||||
|
|
|
|||
|
|
@ -4,6 +4,10 @@
|
|||
(() => {
|
||||
const head = document.getElementsByTagName('head')[0];
|
||||
|
||||
// Detect user language
|
||||
let lang = (navigator.languages && navigator.languages[0]) || navigator.language;
|
||||
if (!/en|en\-US|ja/.test(lang)) lang = 'en';
|
||||
|
||||
// Detect user agent
|
||||
const ua = navigator.userAgent.toLowerCase();
|
||||
const isMobile = /mobile|iphone|ipad|android/.test(ua);
|
||||
|
|
@ -15,7 +19,7 @@
|
|||
*/
|
||||
function mountDesktop() {
|
||||
const script = document.createElement('script');
|
||||
script.setAttribute('src', `/assets/desktop/script.${VERSION}.js`);
|
||||
script.setAttribute('src', `/assets/desktop/script.${VERSION}.${lang}.js`);
|
||||
script.setAttribute('async', 'true');
|
||||
script.setAttribute('defer', 'true');
|
||||
head.appendChild(script);
|
||||
|
|
@ -31,7 +35,7 @@
|
|||
head.appendChild(meta);
|
||||
|
||||
const script = document.createElement('script');
|
||||
script.setAttribute('src', `/assets/mobile/script.${VERSION}.js`);
|
||||
script.setAttribute('src', `/assets/mobile/script.${VERSION}.${lang}.js`);
|
||||
script.setAttribute('async', 'true');
|
||||
script.setAttribute('defer', 'true');
|
||||
head.appendChild(script);
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<li class="home { active: page == 'home' }">
|
||||
<a href={ CONFIG.url }>
|
||||
<i class="fa fa-home"></i>
|
||||
<p>ホーム</p>
|
||||
<p>'i18n:home'</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="messaging">
|
||||
|
|
|
|||
|
|
@ -4,73 +4,94 @@
|
|||
|
||||
import * as webpack from 'webpack';
|
||||
const StringReplacePlugin = require('string-replace-webpack-plugin');
|
||||
|
||||
import version from './src/version';
|
||||
const constants = require('./src/const.json');
|
||||
|
||||
const languages = {
|
||||
'en': require('./locales/en.json'),
|
||||
'en-US': require('./locales/en.json'),
|
||||
'ja': require('./locales/ja.json')
|
||||
};
|
||||
|
||||
const env = process.env.NODE_ENV;
|
||||
const isProduction = env === 'production';
|
||||
|
||||
const pack: webpack.Configuration = {
|
||||
entry: {
|
||||
'desktop': './src/web/app/desktop/script.js',
|
||||
'mobile': './src/web/app/mobile/script.js',
|
||||
'dev': './src/web/app/dev/script.js',
|
||||
'auth': './src/web/app/auth/script.js'
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
enforce: 'pre',
|
||||
test: /\.tag$/,
|
||||
exclude: /node_modules/,
|
||||
loader: StringReplacePlugin.replace({
|
||||
replacements: [
|
||||
{ pattern: /\$theme\-color\-foreground/g, replacement: () => constants.themeColorForeground },
|
||||
{ pattern: /\$theme\-color/g, replacement: () => constants.themeColor },
|
||||
]
|
||||
})
|
||||
},
|
||||
{
|
||||
test: /\.tag$/,
|
||||
exclude: /node_modules/,
|
||||
loader: 'riot-tag-loader',
|
||||
query: {
|
||||
hot: false,
|
||||
style: 'stylus',
|
||||
expr: false,
|
||||
compact: true,
|
||||
parserOptions: {
|
||||
style: {
|
||||
compress: true
|
||||
module.exports = (Object as any).entries(languages).map(([lang, locale]) => {
|
||||
const pack /*: webpack.Configuration ← fuck wrong type definition!!! */ = {
|
||||
name: lang,
|
||||
entry: {
|
||||
'desktop': './src/web/app/desktop/script.js',
|
||||
'mobile': './src/web/app/mobile/script.js',
|
||||
'dev': './src/web/app/dev/script.js',
|
||||
'auth': './src/web/app/auth/script.js'
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
enforce: 'pre',
|
||||
test: /\.*$/,
|
||||
exclude: /node_modules/,
|
||||
loader: StringReplacePlugin.replace({
|
||||
replacements: [
|
||||
{ pattern: /'i18n:(.+?)'/g, replacement: (_, text) => locale[text] }
|
||||
]
|
||||
})
|
||||
},
|
||||
{
|
||||
enforce: 'pre',
|
||||
test: /\.tag$/,
|
||||
exclude: /node_modules/,
|
||||
loader: StringReplacePlugin.replace({
|
||||
replacements: [
|
||||
{ pattern: /\$theme\-color\-foreground/g, replacement: () => constants.themeColorForeground },
|
||||
{ pattern: /\$theme\-color/g, replacement: () => constants.themeColor },
|
||||
]
|
||||
})
|
||||
},
|
||||
{
|
||||
test: /\.tag$/,
|
||||
exclude: /node_modules/,
|
||||
loader: 'riot-tag-loader',
|
||||
query: {
|
||||
hot: false,
|
||||
style: 'stylus',
|
||||
expr: false,
|
||||
compact: true,
|
||||
parserOptions: {
|
||||
style: {
|
||||
compress: true
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
test: /\.styl$/,
|
||||
exclude: /node_modules/,
|
||||
use: [
|
||||
{ loader: 'style-loader' },
|
||||
{ loader: 'css-loader' },
|
||||
{ loader: 'stylus-loader' }
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
test: /\.styl$/,
|
||||
exclude: /node_modules/,
|
||||
use: [
|
||||
{ loader: 'style-loader' },
|
||||
{ loader: 'css-loader' },
|
||||
{ loader: 'stylus-loader' }
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
plugins: [
|
||||
new webpack.DefinePlugin({
|
||||
VERSION: JSON.stringify(version),
|
||||
THEME_COLOR: JSON.stringify(constants.themeColor)
|
||||
}),
|
||||
new StringReplacePlugin()
|
||||
],
|
||||
output: {
|
||||
filename: `[name]/script.${version}.js`
|
||||
]
|
||||
},
|
||||
plugins: [
|
||||
new webpack.DefinePlugin({
|
||||
VERSION: JSON.stringify(version),
|
||||
THEME_COLOR: JSON.stringify(constants.themeColor)
|
||||
}),
|
||||
new StringReplacePlugin()
|
||||
],
|
||||
output: {
|
||||
path: __dirname + '/built/web/assets',
|
||||
filename: `[name]/script.${version}.${lang}.js`
|
||||
}
|
||||
};
|
||||
|
||||
if (isProduction) {
|
||||
//pack.plugins.push(new webpack.optimize.UglifyJsPlugin());
|
||||
}
|
||||
};
|
||||
|
||||
if (isProduction) {
|
||||
//pack.plugins.push(new webpack.optimize.UglifyJsPlugin());
|
||||
}
|
||||
|
||||
module.exports = pack;
|
||||
return pack;
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue