v12 (#5712)

Co-authored-by: MeiMei <30769358+mei23@users.noreply.github.com>
Co-authored-by: Satsuki Yanagi <17376330+u1-liquid@users.noreply.github.com>

webpack.config.ts

@@ -6,7 +6,6 @@ import * as fs from 'fs';
 import * as webpack from 'webpack';
 import * as chalk from 'chalk';
 const { VueLoaderPlugin } = require('vue-loader');
-const HardSourceWebpackPlugin = require('hard-source-webpack-plugin');
 const ProgressBarPlugin = require('progress-bar-webpack-plugin');
 const TerserPlugin = require('terser-webpack-plugin');
 
@@ -20,13 +19,9 @@ class WebpackOnBuildPlugin {
 }
 
 const isProduction = process.env.NODE_ENV == 'production';
-const useHardSource = process.env.MISSKEY_USE_HARD_SOURCE;
-
-const constants = require('./src/const.json');
 
 const locales = require('./locales');
 const meta = require('./package.json');
-const codename = meta.codename;
 
 const postcss = {
 	loader: 'postcss-loader',
@@ -41,12 +36,8 @@ const postcss = {
 
 module.exports = {
 	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'
+		app: './src/client/init.ts',
+		sw: './src/client/sw.js'
 	},
 	module: {
 		rules: [{
@@ -64,7 +55,7 @@ module.exports = {
 				loader: 'vue-svg-inline-loader'
 			}]
 		}, {
-			test: /\.styl(us)?$/,
+			test: /\.scss?$/,
 			exclude: /node_modules/,
 			oneOf: [{
 				resourceQuery: /module/,
@@ -76,7 +67,13 @@ module.exports = {
 						modules: true
 					}
 				}, postcss, {
-					loader: 'stylus-loader'
+					loader: 'sass-loader',
+					options: {
+						implementation: require('sass'),
+						sassOptions: {
+							fiber: require('fibers')
+						}
+					}
 				}]
 			}, {
 				use: [{
@@ -84,7 +81,13 @@ module.exports = {
 				}, {
 					loader: 'css-loader'
 				}, postcss, {
-					loader: 'stylus-loader'
+					loader: 'sass-loader',
+					options: {
+						implementation: require('sass'),
+						sassOptions: {
+							fiber: require('fibers')
+						}
+					}
 				}]
 			}]
 		}, {
@@ -107,42 +110,32 @@ module.exports = {
 				loader: 'ts-loader',
 				options: {
 					happyPackMode: true,
-					configFile: __dirname + '/src/client/app/tsconfig.json',
+					transpileOnly: true,
+					configFile: __dirname + '/src/client/tsconfig.json',
 					appendTsSuffixTo: [/\.vue$/]
 				}
 			}]
 		}]
 	},
 	plugins: [
-		...(useHardSource ? [new HardSourceWebpackPlugin()] : []),
 		new ProgressBarPlugin({
-			format: chalk`  {cyan.bold yes we can} {bold [}:bar{bold ]} {green.bold :percent} {gray (:current/:total)} :elapseds`,
+			format: chalk`  {cyan.bold Yes we can} {bold [}:bar{bold ]} {green.bold :percent} {gray :elapseds}`,
 			clear: false
 		}),
 		new webpack.DefinePlugin({
-			_COPYRIGHT_: JSON.stringify(constants.copyright),
 			_VERSION_: JSON.stringify(meta.version),
-			_CODENAME_: JSON.stringify(codename),
 			_LANGS_: JSON.stringify(Object.entries(locales).map(([k, v]: [string, any]) => [k, v && v.meta && v.meta.lang])),
 			_ENV_: JSON.stringify(process.env.NODE_ENV)
 		}),
-		new webpack.DefinePlugin({
-			'process.env.NODE_ENV': JSON.stringify(isProduction ? 'production' : 'development')
-		}),
+		new VueLoaderPlugin(),
 		new WebpackOnBuildPlugin((stats: any) => {
 			fs.writeFileSync('./built/meta.json', JSON.stringify({ version: meta.version }), 'utf-8');
-
-			fs.mkdirSync('./built/client/assets/locales', { recursive: true });
-
-			for (const [lang, locale] of Object.entries(locales))
-				fs.writeFileSync(`./built/client/assets/locales/${lang}.json`, JSON.stringify(locale), 'utf-8');
 		}),
-		new VueLoaderPlugin(),
-		new webpack.optimize.ModuleConcatenationPlugin()
 	],
 	output: {
 		path: __dirname + '/built/client/assets',
 		filename: `[name].${meta.version}.js`,
+		chunkFilename: '[hash:5].[id].js',
 		publicPath: `/assets/`
 	},
 	resolve: {
@@ -156,6 +149,9 @@ module.exports = {
 	resolveLoader: {
 		modules: ['node_modules']
 	},
+	externals: {
+		moment: 'moment'
+	},
 	optimization: {
 		minimizer: [new TerserPlugin()]
 	},