build @growi/hackmd with vite

apps/app/src/server/routes/hackmd.js

@@ -1,10 +1,11 @@
+import * as hackmdFiles from '@growi/hackmd';
+
 import loggerFactory from '~/utils/logger';
 
 /* eslint-disable no-use-before-define */
 
 const logger = loggerFactory('growi:routes:hackmd');
 
-const hackmdFiles = require('@growi/hackmd');
 const axios = require('axios');
 const ejs = require('ejs');
 

apps/app/tsconfig.build.client.json

@@ -12,7 +12,7 @@
 
       "@growi/codemirror-textlint": ["../../packages/codemirror-textlint/src"],
       // "@growi/core": ["../../packages/core/src"],
-      "@growi/hackmd": ["../../packages/hackmd/src"],
+      // "@growi/hackmd": ["../../packages/hackmd/src"],
       // "@growi/presentation": ["../../packages/presentation/src"],
       // "@growi/preset-themes": ["../../packages/preset-themes/src"],
       "@growi/remark-drawio": ["../../packages/remark-drawio/src"],

apps/app/tsconfig.json

@@ -10,7 +10,7 @@
 
       "@growi/codemirror-textlint": ["../../packages/codemirror-textlint/src"],
       // "@growi/core": ["../../packages/core/src"],
-      "@growi/hackmd": ["../../packages/hackmd/src"],
+      // "@growi/hackmd": ["../../packages/hackmd/src"],
       // "@growi/presentation": ["../../packages/presentation/src"],
       // "@growi/preset-themes": ["../../packages/preset-themes/src"],
       "@growi/remark-drawio": ["../../packages/remark-drawio/src"],

packages/hackmd/.gitignore

@@ -1 +1,2 @@
 /dist
+/types

packages/hackmd/package.json

@@ -4,6 +4,7 @@
   "description": "GROWI js and css files to use hackmd",
   "license": "MIT",
   "main": "dist/index.js",
+  "types": "types/hackmd-styles.d.ts",
   "scripts": {
     "build": "vite build",
     "clean": "npx -y shx rm -rf dist types",

packages/hackmd/public/index.js

@@ -3,9 +3,9 @@ const path = require('path');
 
 const isProduction = process.env.NODE_ENV === 'production';
 const dirPath = isProduction ? '.' : '../dist';
-const stylesJSFile = fs.readFileSync(path.resolve(__dirname, `${dirPath}/styles.js`));
-const agentJSFile = fs.readFileSync(path.resolve(__dirname, `${dirPath}/agent.js`));
-const stylesCSSFile = fs.readFileSync(path.resolve(__dirname, `${dirPath}/styles.css`));
+const stylesJSFile = fs.readFileSync(path.resolve(__dirname, `${dirPath}/hackmd-styles.mjs`));
+const agentJSFile = fs.readFileSync(path.resolve(__dirname, `${dirPath}/hackmd-agent.mjs`));
+const stylesCSSFile = fs.readFileSync(path.resolve(__dirname, `${dirPath}/style.css`));
 
 // export to app as string
 module.exports = {

packages/hackmd/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "http://json.schemastore.org/tsconfig",
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+    }
+  },
+  "include": [
+    "src"
+  ]
+}

packages/hackmd/vite.config.js

@@ -1,20 +1,22 @@
-import { resolve } from 'path';
-
 import { defineConfig } from 'vite';
+import dts from 'vite-plugin-dts';
 
 
+// https://vitejs.dev/config/
 export default defineConfig({
+  plugins: [
+    dts({ outputDir: 'types' }),
+  ],
   build: {
-    rollupOptions: {
-      input: {
-        styles: resolve(__dirname, 'src/hackmd-styles.js'),
-        agent: resolve(__dirname, 'src/hackmd-agent.js'),
-        stylesCSS: resolve(__dirname, 'src/styles.scss'),
-      },
-      output: {
-        entryFileNames: '[name].js',
-        assetFileNames: '[name].css',
-      },
+    outDir: 'dist',
+    lib: {
+      entry: [
+        'src/hackmd-styles.js',
+        'src/hackmd-agent.js',
+        'src/style.scss',
+      ],
+      name: 'hackmd-libs',
+      formats: ['es'],
     },
   },
 });