mirror of
https://activitypub.software/TransFem-org/Sharkey.git
synced 2024-12-13 05:00:45 +01:00
[Client] Enable code splitting
And some optimizations
This commit is contained in:
parent
0b40194d31
commit
b1b02d0e32
10 changed files with 82 additions and 115 deletions
11
gulpfile.ts
11
gulpfile.ts
|
@ -57,16 +57,7 @@ gulp.task('build:copy:views', () =>
|
|||
gulp.src('./src/server/web/views/**/*').pipe(gulp.dest('./built/server/web/views'))
|
||||
);
|
||||
|
||||
// 互換性のため
|
||||
gulp.task('build:copy:lang', () =>
|
||||
gulp.src(['./built/client/assets/*.*-*.js'])
|
||||
.pipe(rename(path => {
|
||||
path.basename = path.basename.replace(/\-(.*)$/, '');
|
||||
}))
|
||||
.pipe(gulp.dest('./built/client/assets/'))
|
||||
);
|
||||
|
||||
gulp.task('build:copy', ['build:copy:views', 'build:copy:lang'], () =>
|
||||
gulp.task('build:copy', ['build:copy:views'], () =>
|
||||
gulp.src([
|
||||
'./build/Release/crypto_key.node',
|
||||
'./src/const.json',
|
||||
|
|
|
@ -99,6 +99,7 @@
|
|||
"commander": "2.19.0",
|
||||
"crc-32": "1.2.0",
|
||||
"css-loader": "1.0.1",
|
||||
"cssnano": "4.1.7",
|
||||
"dateformat": "3.0.3",
|
||||
"debug": "4.1.0",
|
||||
"deep-equal": "1.0.1",
|
||||
|
@ -167,6 +168,7 @@
|
|||
"os-utils": "0.0.14",
|
||||
"parse5": "5.1.0",
|
||||
"portscanner": "2.2.0",
|
||||
"postcss-loader": "3.0.0",
|
||||
"progress-bar-webpack-plugin": "1.11.0",
|
||||
"promise-limit": "2.7.0",
|
||||
"promise-sequential": "1.1.1",
|
||||
|
|
|
@ -1,8 +1,10 @@
|
|||
const crypto = require('crypto');
|
||||
// スクリプトサイズがデカい
|
||||
//const crypto = require('crypto');
|
||||
|
||||
export default (data: ArrayBuffer) => {
|
||||
const buf = new Buffer(data);
|
||||
const hash = crypto.createHash("md5");
|
||||
hash.update(buf);
|
||||
return hash.digest("hex");
|
||||
};
|
||||
//const buf = new Buffer(data);
|
||||
//const hash = crypto.createHash("md5");
|
||||
//hash.update(buf);
|
||||
//return hash.digest("hex");
|
||||
return '';
|
||||
};
|
||||
|
|
|
@ -7,7 +7,8 @@
|
|||
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import { lib } from 'emojilib';
|
||||
// スクリプトサイズがデカい
|
||||
//import { lib } from 'emojilib';
|
||||
|
||||
export default Vue.extend({
|
||||
props: {
|
||||
|
@ -50,10 +51,10 @@ export default Vue.extend({
|
|||
this.customEmoji = customEmoji;
|
||||
this.url = customEmoji.url;
|
||||
} else {
|
||||
const emoji = lib[this.name];
|
||||
if (emoji) {
|
||||
this.char = emoji.char;
|
||||
}
|
||||
//const emoji = lib[this.name];
|
||||
//if (emoji) {
|
||||
// this.char = emoji.char;
|
||||
//}
|
||||
}
|
||||
} else {
|
||||
this.char = this.emoji;
|
||||
|
|
|
@ -1,5 +1,4 @@
|
|||
import * as getCaretCoordinates from 'textarea-caret';
|
||||
import MkAutocomplete from '../components/autocomplete.vue';
|
||||
import { toASCII } from 'punycode';
|
||||
|
||||
export default {
|
||||
|
@ -123,7 +122,7 @@ class Autocomplete {
|
|||
/**
|
||||
* サジェストを提示します。
|
||||
*/
|
||||
private open(type, q) {
|
||||
private async open(type, q) {
|
||||
if (type != this.currentType) {
|
||||
this.close();
|
||||
}
|
||||
|
@ -143,6 +142,8 @@ class Autocomplete {
|
|||
this.suggestion.y = y;
|
||||
this.suggestion.q = q;
|
||||
} else {
|
||||
const MkAutocomplete = await import('../components/autocomplete.vue').then(m => m.default);
|
||||
|
||||
// サジェスト要素作成
|
||||
this.suggestion = new MkAutocomplete({
|
||||
parent: this.vm,
|
||||
|
|
|
@ -13,7 +13,7 @@ import { url } from '../../../config';
|
|||
export default Vue.extend({
|
||||
i18n: i18n('desktop/views/components/game-window.vue'),
|
||||
components: {
|
||||
XReversi: () => import('../../../common/views/components/games/reversi/reversi.vue')
|
||||
XReversi: () => import('../../../common/views/components/games/reversi/reversi.vue').then(m => m.default)
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
|
@ -9,7 +9,7 @@ import Vue from 'vue';
|
|||
|
||||
export default Vue.extend({
|
||||
components: {
|
||||
XReversi: () => import('../../../../common/views/components/games/reversi/reversi.vue')
|
||||
XReversi: () => import('../../../../common/views/components/games/reversi/reversi.vue').then(m => m.default)
|
||||
},
|
||||
props: {
|
||||
ui: {
|
||||
|
|
|
@ -12,7 +12,7 @@ import i18n from '../../../../i18n';
|
|||
export default Vue.extend({
|
||||
i18n: i18n('mobile/views/pages/games/reversi.vue'),
|
||||
components: {
|
||||
XReversi: () => import('../../../../common/views/components/games/reversi/reversi.vue')
|
||||
XReversi: () => import('../../../../common/views/components/games/reversi/reversi.vue').then(m => m.default)
|
||||
},
|
||||
mounted() {
|
||||
document.title = `${this.$root.instanceName} %i18n:@reversi%`;
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
"declaration": false,
|
||||
"sourceMap": false,
|
||||
"target": "es2017",
|
||||
"module": "commonjs",
|
||||
"module": "esnext",
|
||||
"removeComments": false,
|
||||
"noLib": false,
|
||||
"strict": true,
|
||||
|
|
|
@ -17,82 +17,28 @@ const meta = require('./package.json');
|
|||
const version = meta.clientVersion;
|
||||
const codename = meta.codename;
|
||||
|
||||
const langs = Object.keys(locales);
|
||||
|
||||
const isProduction = process.env.NODE_ENV == 'production';
|
||||
|
||||
// Entries
|
||||
const entry = {
|
||||
desktop: './src/client/app/desktop/script.ts',
|
||||
mobile: './src/client/app/mobile/script.ts',
|
||||
dev: './src/client/app/dev/script.ts',
|
||||
auth: './src/client/app/auth/script.ts',
|
||||
admin: './src/client/app/admin/script.ts',
|
||||
sw: './src/client/app/sw.js'
|
||||
const postcss = {
|
||||
loader: 'postcss-loader',
|
||||
options: {
|
||||
plugins: [
|
||||
require('cssnano')({
|
||||
preset: 'default'
|
||||
})
|
||||
]
|
||||
},
|
||||
};
|
||||
|
||||
const output = {
|
||||
path: __dirname + '/built/client/assets',
|
||||
filename: `[name].${version}.-.js`
|
||||
};
|
||||
|
||||
//#region Define consts
|
||||
const consts = {
|
||||
_THEME_COLOR_: constants.themeColor,
|
||||
_COPYRIGHT_: constants.copyright,
|
||||
_VERSION_: meta.version,
|
||||
_CLIENT_VERSION_: version,
|
||||
_CODENAME_: codename,
|
||||
_LANG_: '%lang%',
|
||||
_LANGS_: Object.keys(locales).map(l => [l, locales[l].meta.lang]),
|
||||
_LOCALE_: '%locale%',
|
||||
_ENV_: process.env.NODE_ENV
|
||||
};
|
||||
|
||||
const _consts: { [ key: string ]: any } = {};
|
||||
|
||||
Object.keys(consts).forEach(key => {
|
||||
_consts[key] = JSON.stringify((consts as any)[key]);
|
||||
});
|
||||
//#endregion
|
||||
|
||||
const plugins = [
|
||||
//new HardSourceWebpackPlugin(),
|
||||
new ProgressBarPlugin({
|
||||
format: chalk` {cyan.bold yes we can} {bold [}:bar{bold ]} {green.bold :percent} {gray (:current/:total)} :elapseds`,
|
||||
clear: false
|
||||
}),
|
||||
new webpack.DefinePlugin(_consts),
|
||||
new webpack.DefinePlugin({
|
||||
'process.env.NODE_ENV': JSON.stringify(isProduction ? 'production' : 'development')
|
||||
}),
|
||||
new WebpackOnBuildPlugin((stats: any) => {
|
||||
fs.writeFileSync('./built/client/meta.json', JSON.stringify({
|
||||
version
|
||||
}), 'utf-8');
|
||||
|
||||
//#region i18n
|
||||
langs.forEach(lang => {
|
||||
Object.keys(entry).forEach(file => {
|
||||
let src = fs.readFileSync(`${__dirname}/built/client/assets/${file}.${version}.-.js`, 'utf-8');
|
||||
|
||||
src = src.replace('%lang%', lang);
|
||||
src = src.replace('"%locale%"', JSON.stringify(locales[lang]));
|
||||
|
||||
fs.writeFileSync(`${__dirname}/built/client/assets/${file}.${version}.${lang}.js`, src, 'utf-8');
|
||||
});
|
||||
});
|
||||
//#endregion
|
||||
}),
|
||||
new VueLoaderPlugin()
|
||||
];
|
||||
|
||||
if (isProduction) {
|
||||
plugins.push(new webpack.optimize.ModuleConcatenationPlugin());
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
entry,
|
||||
module.exports = Object.keys(locales).map(lang => ({
|
||||
entry: {
|
||||
desktop: './src/client/app/desktop/script.ts',
|
||||
mobile: './src/client/app/mobile/script.ts',
|
||||
dev: './src/client/app/dev/script.ts',
|
||||
auth: './src/client/app/auth/script.ts',
|
||||
admin: './src/client/app/admin/script.ts',
|
||||
sw: './src/client/app/sw.js'
|
||||
},
|
||||
module: {
|
||||
rules: [{
|
||||
test: /\.vue$/,
|
||||
|
@ -118,21 +64,17 @@ module.exports = {
|
|||
}, {
|
||||
loader: 'css-loader',
|
||||
options: {
|
||||
modules: true,
|
||||
minimize: true
|
||||
modules: true
|
||||
}
|
||||
}, {
|
||||
}, postcss, {
|
||||
loader: 'stylus-loader'
|
||||
}]
|
||||
}, {
|
||||
use: [{
|
||||
loader: 'vue-style-loader'
|
||||
}, {
|
||||
loader: 'css-loader',
|
||||
options: {
|
||||
minimize: true
|
||||
}
|
||||
}, {
|
||||
loader: 'css-loader'
|
||||
}, postcss, {
|
||||
loader: 'stylus-loader'
|
||||
}]
|
||||
}]
|
||||
|
@ -141,11 +83,8 @@ module.exports = {
|
|||
use: [{
|
||||
loader: 'vue-style-loader'
|
||||
}, {
|
||||
loader: 'css-loader',
|
||||
options: {
|
||||
minimize: true
|
||||
}
|
||||
}]
|
||||
loader: 'css-loader'
|
||||
}, postcss]
|
||||
}, {
|
||||
test: /\.(eot|woff|woff2|svg|ttf)([\?]?.*)$/,
|
||||
loader: 'url-loader'
|
||||
|
@ -165,8 +104,39 @@ module.exports = {
|
|||
}]
|
||||
}]
|
||||
},
|
||||
plugins,
|
||||
output,
|
||||
plugins: [
|
||||
//new HardSourceWebpackPlugin(),
|
||||
new ProgressBarPlugin({
|
||||
format: chalk` {cyan.bold yes we can} {bold [}:bar{bold ]} {green.bold :percent} {gray (:current/:total)} :elapseds`,
|
||||
clear: false
|
||||
}),
|
||||
new webpack.DefinePlugin({
|
||||
_THEME_COLOR_: JSON.stringify(constants.themeColor),
|
||||
_COPYRIGHT_: JSON.stringify(constants.copyright),
|
||||
_VERSION_: JSON.stringify(meta.version),
|
||||
_CLIENT_VERSION_: JSON.stringify(version),
|
||||
_CODENAME_: JSON.stringify(codename),
|
||||
_LANG_: JSON.stringify(lang),
|
||||
_LANGS_: JSON.stringify(Object.keys(locales).map(l => [l, locales[l].meta.lang])),
|
||||
_LOCALE_: JSON.stringify(locales[lang]),
|
||||
_ENV_: JSON.stringify(process.env.NODE_ENV)
|
||||
}),
|
||||
new webpack.DefinePlugin({
|
||||
'process.env.NODE_ENV': JSON.stringify(isProduction ? 'production' : 'development')
|
||||
}),
|
||||
new WebpackOnBuildPlugin((stats: any) => {
|
||||
fs.writeFileSync('./built/client/meta.json', JSON.stringify({
|
||||
version
|
||||
}), 'utf-8');
|
||||
}),
|
||||
new VueLoaderPlugin(),
|
||||
new webpack.optimize.ModuleConcatenationPlugin()
|
||||
],
|
||||
output: {
|
||||
path: __dirname + '/built/client/assets',
|
||||
filename: `[name].${version}.${lang}.js`,
|
||||
publicPath: `/assets/`
|
||||
},
|
||||
resolve: {
|
||||
extensions: [
|
||||
'.js', '.ts', '.json'
|
||||
|
@ -181,4 +151,4 @@ module.exports = {
|
|||
cache: true,
|
||||
devtool: false, //'source-map',
|
||||
mode: isProduction ? 'production' : 'development'
|
||||
};
|
||||
}));
|
||||
|
|
Loading…
Reference in a new issue