refactor(locales, sw): use es module (#11204)

* refactor(locales): use es module

* fix sw build

* fix gulp

* try fixing storybook

* Revert "try fixing storybook"

This reverts commit 5f2a4eee016776381a7d80407e28d129c252228f.

* try fixing storybook 2

* Update main.ts

* Update build.js

* Update main.ts

* Update changes.ts

* fix sw lint

* Update build.js
This commit is contained in:
Kagami Sascha Rosylight 2023-07-09 10:19:07 +02:00 committed by GitHub
parent 5059d4d7e1
commit 59046d583d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 54 additions and 36 deletions

View file

@ -2,14 +2,14 @@
* Gulp tasks * Gulp tasks
*/ */
const fs = require('fs'); import * as fs from 'node:fs';
const gulp = require('gulp'); import gulp from 'gulp';
const replace = require('gulp-replace'); import replace from 'gulp-replace';
const terser = require('gulp-terser'); import terser from 'gulp-terser';
const cssnano = require('gulp-cssnano'); import cssnano from 'gulp-cssnano';
const locales = require('./locales'); import locales from './locales/index.js';
const meta = require('./package.json'); import meta from './package.json' assert { type: "json" };
gulp.task('copy:backend:views', () => gulp.task('copy:backend:views', () =>
gulp.src('./packages/backend/src/server/web/views/**/*').pipe(gulp.dest('./packages/backend/built/server/web/views')) gulp.src('./packages/backend/src/server/web/views/**/*').pipe(gulp.dest('./packages/backend/built/server/web/views'))

View file

@ -1,6 +1,6 @@
const fs = require('fs'); import * as fs from 'node:fs';
const yaml = require('js-yaml'); import * as yaml from 'js-yaml';
const ts = require('typescript'); import * as ts from 'typescript';
function createMembers(record) { function createMembers(record) {
return Object.entries(record) return Object.entries(record)
@ -14,7 +14,7 @@ function createMembers(record) {
)); ));
} }
module.exports = function generateDTS() { export default function generateDTS() {
const locale = yaml.load(fs.readFileSync(`${__dirname}/ja-JP.yml`, 'utf-8')); const locale = yaml.load(fs.readFileSync(`${__dirname}/ja-JP.yml`, 'utf-8'));
const members = createMembers(locale); const members = createMembers(locale);
const elements = [ const elements = [

View file

@ -2,8 +2,8 @@
* Languages Loader * Languages Loader
*/ */
const fs = require('fs'); import * as fs from 'node:fs';
const yaml = require('js-yaml'); import * as yaml from 'js-yaml';
const merge = (...args) => args.reduce((a, c) => ({ const merge = (...args) => args.reduce((a, c) => ({
...a, ...a,
@ -51,9 +51,9 @@ const primaries = {
// 何故か文字列にバックスペース文字が混入することがあり、YAMLが壊れるので取り除く // 何故か文字列にバックスペース文字が混入することがあり、YAMLが壊れるので取り除く
const clean = (text) => text.replace(new RegExp(String.fromCodePoint(0x08), 'g'), ''); const clean = (text) => text.replace(new RegExp(String.fromCodePoint(0x08), 'g'), '');
const locales = languages.reduce((a, c) => (a[c] = yaml.load(clean(fs.readFileSync(`${__dirname}/${c}.yml`, 'utf-8'))) || {}, a), {}); const locales = languages.reduce((a, c) => (a[c] = yaml.load(clean(fs.readFileSync(new URL(`${c}.yml`, import.meta.url), 'utf-8'))) || {}, a), {});
module.exports = Object.entries(locales) export default Object.entries(locales)
.reduce((a, [k ,v]) => (a[k] = (() => { .reduce((a, [k ,v]) => (a[k] = (() => {
const [lang] = k.split('-'); const [lang] = k.split('-');
switch (k) { switch (k) {

3
locales/package.json Normal file
View file

@ -0,0 +1,3 @@
{
"type": "module"
}

View file

@ -1,7 +1,10 @@
import fs from 'node:fs/promises'; import fs from 'node:fs/promises';
import { fileURLToPath } from 'node:url';
import path from 'node:path'; import path from 'node:path';
import micromatch from 'micromatch'; import micromatch from 'micromatch';
import main from './main'; import main from './main.js';
const __dirname = fileURLToPath(new URL('.', import.meta.url));
interface Stats { interface Stats {
readonly modules: readonly { readonly modules: readonly {
@ -13,8 +16,8 @@ interface Stats {
}[]; }[];
} }
fs.readFile( await fs.readFile(
path.resolve(__dirname, '../storybook-static/preview-stats.json') new URL('../storybook-static/preview-stats.json', import.meta.url)
).then((buffer) => { ).then((buffer) => {
const stats: Stats = JSON.parse(buffer.toString()); const stats: Stats = JSON.parse(buffer.toString());
const keys = new Set(stats.modules.map((stat) => stat.id)); const keys = new Set(stats.modules.map((stat) => stat.id));

View file

@ -1,7 +1,11 @@
import { resolve } from 'node:path'; import { resolve } from 'node:path';
import { fileURLToPath } from 'node:url';
import type { StorybookConfig } from '@storybook/vue3-vite'; import type { StorybookConfig } from '@storybook/vue3-vite';
import { type Plugin, mergeConfig } from 'vite'; import { type Plugin, mergeConfig } from 'vite';
import turbosnap from 'vite-plugin-turbosnap'; import turbosnap from 'vite-plugin-turbosnap';
const dirname = fileURLToPath(new URL('.', import.meta.url));
const config = { const config = {
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'], stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
addons: [ addons: [
@ -9,7 +13,7 @@ const config = {
'@storybook/addon-interactions', '@storybook/addon-interactions',
'@storybook/addon-links', '@storybook/addon-links',
'@storybook/addon-storysource', '@storybook/addon-storysource',
resolve(__dirname, '../node_modules/storybook-addon-misskey-theme'), resolve(dirname, '../node_modules/storybook-addon-misskey-theme'),
], ],
framework: { framework: {
name: '@storybook/vue3-vite', name: '@storybook/vue3-vite',
@ -28,7 +32,8 @@ const config = {
} }
return mergeConfig(config, { return mergeConfig(config, {
plugins: [ plugins: [
turbosnap({ // XXX: https://github.com/IanVS/vite-plugin-turbosnap/issues/8
(turbosnap as any as typeof turbosnap['default'])({
rootDir: config.root ?? process.cwd(), rootDir: config.root ?? process.cwd(),
}), }),
], ],

View file

@ -0,0 +1,3 @@
{
"type": "module"
}

View file

@ -1,9 +1,8 @@
import { writeFile } from 'node:fs/promises'; import { writeFile } from 'node:fs/promises';
import { resolve } from 'node:path'; import * as locales from '../../../locales/index.js';
import * as locales from '../../../locales';
writeFile( await writeFile(
resolve(__dirname, 'locale.ts'), new URL('locale.ts', import.meta.url),
`export default ${JSON.stringify(locales['ja-JP'], undefined, 2)} as const;`, `export default ${JSON.stringify(locales['ja-JP'], undefined, 2)} as const;`,
'utf8', 'utf8',
) )

View file

@ -1,6 +1,5 @@
import { readFile, writeFile } from 'node:fs/promises'; import { readFile, writeFile } from 'node:fs/promises';
import { resolve } from 'node:path'; import JSON5 from 'json5';
import * as JSON5 from 'json5';
const keys = [ const keys = [
'_dark', '_dark',
@ -26,9 +25,9 @@ const keys = [
'd-u0', 'd-u0',
] ]
Promise.all(keys.map((key) => readFile(resolve(__dirname, `../src/themes/${key}.json5`), 'utf8'))).then((sources) => { await Promise.all(keys.map((key) => readFile(new URL(`../src/themes/${key}.json5`, import.meta.url), 'utf8'))).then((sources) => {
writeFile( writeFile(
resolve(__dirname, './themes.ts'), new URL('./themes.ts', import.meta.url),
`export default ${JSON.stringify( `export default ${JSON.stringify(
Object.fromEntries(sources.map((source, i) => [keys[i], JSON5.parse(source)])), Object.fromEntries(sources.map((source, i) => [keys[i], JSON5.parse(source)])),
undefined, undefined,

View file

@ -3,10 +3,10 @@ import { FORCE_REMOUNT } from '@storybook/core-events';
import { type Preview, setup } from '@storybook/vue3'; import { type Preview, setup } from '@storybook/vue3';
import isChromatic from 'chromatic/isChromatic'; import isChromatic from 'chromatic/isChromatic';
import { initialize, mswDecorator } from 'msw-storybook-addon'; import { initialize, mswDecorator } from 'msw-storybook-addon';
import { userDetailed } from './fakes'; import { userDetailed } from './fakes.js';
import locale from './locale'; import locale from './locale.js';
import { commonHandlers, onUnhandledRequest } from './mocks'; import { commonHandlers, onUnhandledRequest } from './mocks.js';
import themes from './themes'; import themes from './themes.js';
import '../src/style.scss'; import '../src/style.scss';
const appInitialized = Symbol(); const appInitialized = Symbol();

View file

@ -1,5 +1,7 @@
{ {
"compilerOptions": { "compilerOptions": {
"target": "es2022",
"module": "Node16",
"strict": true, "strict": true,
"allowUnusedLabels": false, "allowUnusedLabels": false,
"allowUnreachableCode": false, "allowUnreachableCode": false,

View file

@ -1,10 +1,13 @@
// @ts-check // @ts-check
const esbuild = require('esbuild'); import { fileURLToPath } from 'node:url';
const locales = require('../../locales'); import * as esbuild from 'esbuild';
const meta = require('../../package.json'); import locales from '../../locales/index.js';
import meta from '../../package.json' assert { type: "json" };
const watch = process.argv[2]?.includes('watch'); const watch = process.argv[2]?.includes('watch');
const __dirname = fileURLToPath(new URL('.', import.meta.url))
console.log('Starting SW building...'); console.log('Starting SW building...');
/** @type {esbuild.BuildOptions} */ /** @type {esbuild.BuildOptions} */

View file

@ -19,5 +19,6 @@
"eslint": "8.44.0", "eslint": "8.44.0",
"eslint-plugin-import": "2.27.5", "eslint-plugin-import": "2.27.5",
"typescript": "5.1.6" "typescript": "5.1.6"
} },
"type": "module"
} }