@rpgjs/vite 5.0.0-alpha.0

package/src/tiled-map-folder-plugin.ts

@@ -0,0 +1,224 @@
+import { Plugin } from 'vite';
+import { readFileSync, existsSync, statSync, readdirSync, copyFileSync, mkdirSync } from 'fs';
+import { join, extname, relative, dirname } from 'path';
+
+export interface DataFolderPluginOptions {
+    /**
+     * Source folder containing the data files (TMX, TSX, images)
+     */
+    sourceFolder: string;
+    
+    /**
+     * Public path prefix for accessing the data files
+     * @default '/data'
+     */
+    publicPath?: string;
+    
+    /**
+     * Target folder in build output for the data files
+     * @default 'assets/data'
+     */
+    buildOutputPath?: string;
+    
+    /**
+     * File extensions to include
+     * @default ['.tmx', '.tsx', '.png', '.jpg', '.jpeg', '.gif', '.webp', '.svg']
+     */
+    allowedExtensions?: string[];
+}
+
+/**
+ * Vite plugin that serves a data folder in development mode and copies it to assets during build
+ * 
+ * This plugin allows serving game data files (TMX maps, TSX tilesets, images) during development
+ * and automatically includes them in the build output for production deployment.
+ * 
+ * @param options - Configuration options for the plugin
+ * 
+ * @example
+ * ```js
+ * // In vite.config.ts
+ * import { defineConfig } from 'vite';
+ * import { dataFolderPlugin } from '@rpgjs/vite';
+ * 
+ * export default defineConfig({
+ *   plugins: [
+ *     dataFolderPlugin({
+ *       sourceFolder: './game-data',
+ *       publicPath: '/data',
+ *       buildOutputPath: 'assets/data'
+ *     })
+ *   ]
+ * });
+ * ```
+ */
+export function tiledMapFolderPlugin(options: DataFolderPluginOptions): Plugin {
+    const {
+        sourceFolder,
+        publicPath = '/data',
+        buildOutputPath = 'assets/data',
+        allowedExtensions = ['.tmx', '.tsx', '.png', '.jpg', '.jpeg', '.gif', '.webp', '.svg']
+    } = options;
+
+    let isBuild = false;
+    let outputDir = 'dist';
+
+    /**
+     * Get MIME type based on file extension
+     */
+    const getMimeType = (filePath: string): string => {
+        const ext = extname(filePath).toLowerCase();
+        const mimeTypes: Record<string, string> = {
+            '.tmx': 'application/xml',
+            '.tsx': 'application/xml',
+            '.png': 'image/png',
+            '.jpg': 'image/jpeg',
+            '.jpeg': 'image/jpeg',
+            '.gif': 'image/gif',
+            '.webp': 'image/webp',
+            '.svg': 'image/svg+xml'
+        };
+        return mimeTypes[ext] || 'application/octet-stream';
+    };
+
+    /**
+     * Check if file extension is allowed
+     */
+    const isAllowedFile = (filePath: string): boolean => {
+        const ext = extname(filePath).toLowerCase();
+        return allowedExtensions.includes(ext);
+    };
+
+    /**
+     * Recursively get all files from a directory
+     */
+    const getAllFiles = (dirPath: string, basePath: string = dirPath): string[] => {
+        const files: string[] = [];
+        
+        if (!existsSync(dirPath)) {
+            return files;
+        }
+
+        const items = readdirSync(dirPath);
+        
+        for (const item of items) {
+            const fullPath = join(dirPath, item);
+            const stat = statSync(fullPath);
+            
+            if (stat.isDirectory()) {
+                files.push(...getAllFiles(fullPath, basePath));
+            } else if (isAllowedFile(fullPath)) {
+                files.push(fullPath);
+            }
+        }
+        
+        return files;
+    };
+
+    /**
+     * Copy files to build output directory
+     */
+    const copyFilesToBuild = (outputPath: string) => {
+        const files = getAllFiles(sourceFolder);
+        
+        for (const filePath of files) {
+            const relativePath = relative(sourceFolder, filePath);
+            const targetPath = join(outputPath, buildOutputPath, relativePath);
+            const targetDir = dirname(targetPath);
+            
+            // Create target directory if it doesn't exist
+            mkdirSync(targetDir, { recursive: true });
+            
+            // Copy file
+            copyFileSync(filePath, targetPath);
+            console.log(`📁 Copied data file: ${relativePath}`);
+        }
+    };
+
+    return {
+        name: 'data-folder',
+        enforce: 'pre',
+
+        configResolved(config) {
+            isBuild = config.command === 'build';
+            outputDir = config.build.outDir || 'dist';
+        },
+
+        // Handle build mode - copy files to output directory
+        generateBundle() {
+            if (isBuild) {
+                console.log(`📦 Copying data files from ${sourceFolder} to ${buildOutputPath}...`);
+                copyFilesToBuild(outputDir);
+                console.log('✅ Data files copied successfully');
+            }
+        },
+
+        // Handle development mode - serve files via middleware
+        configureServer(server) {
+            if (!existsSync(sourceFolder)) {
+                console.warn(`⚠️  Data folder not found: ${sourceFolder}`);
+                return;
+            }
+
+            console.log(`📁 Serving data folder: ${sourceFolder} at ${publicPath}`);
+
+            server.middlewares.use((req: any, res: any, next: any) => {
+                if (!req.url?.startsWith(publicPath)) {
+                    return next();
+                }
+
+                // Remove public path prefix to get relative file path
+                const relativePath = req.url.slice(publicPath.length);
+                
+                // Remove leading slash if present
+                const cleanPath = relativePath.startsWith('/') ? relativePath.slice(1) : relativePath;
+                
+                // Construct full file path
+                const filePath = join(sourceFolder, cleanPath);
+
+                // Security check - ensure file is within source folder
+                const cwd = typeof process !== 'undefined' ? process.cwd() : '';
+                const resolvedFilePath = join(cwd, filePath);
+                const resolvedSourceFolder = join(cwd, sourceFolder);
+                
+                if (!resolvedFilePath.startsWith(resolvedSourceFolder)) {
+                    res.statusCode = 403;
+                    res.end('Forbidden');
+                    return;
+                }
+
+                // Check if file exists and is allowed
+                if (!existsSync(filePath) || !isAllowedFile(filePath)) {
+                    res.statusCode = 404;
+                    res.end('Not Found');
+                    return;
+                }
+
+                // Check if it's a file (not directory)
+                const stat = statSync(filePath);
+                if (!stat.isFile()) {
+                    res.statusCode = 404;
+                    res.end('Not Found');
+                    return;
+                }
+
+                try {
+                    // Read and serve the file
+                    const fileContent = readFileSync(filePath);
+                    const mimeType = getMimeType(filePath);
+                    
+                    res.setHeader('Content-Type', mimeType);
+                    res.setHeader('Cache-Control', 'no-cache');
+                    res.setHeader('Access-Control-Allow-Origin', '*');
+                    res.end(fileContent);
+                    
+                    console.log(`📄 Served data file: ${cleanPath}`);
+                } catch (error) {
+                    console.error(`❌ Error serving file ${filePath}:`, error);
+                    res.statusCode = 500;
+                    res.end('Internal Server Error');
+                }
+            });
+        }
+    };
+} 

package/tests/directive-plugin.spec.ts

@@ -0,0 +1,34 @@
+import { describe, it, expect } from 'vitest'
+import { directivePlugin } from '../src/directive-plugin'
+
+const pluginClient = directivePlugin({ side: 'client' })
+const pluginServer = directivePlugin({ side: 'server' })
+
+const fileSource = `'use client';\nexport function hello(){ return 'hi' }`
+const funcSource = `export function foo(){\n  'use server';\n  return 1;\n}\nexport const bar = () => {\n  'use client';\n  return 2;\n}`
+
+describe('directivePlugin', () => {
+  it('keeps file for matching side', async () => {
+    const res = await pluginClient.transform(fileSource, 'file.ts') as any
+    expect(res.code).toContain("export function hello")
+    expect(res.code).not.toContain('use client')
+  })
+
+  it('removes file for opposite side', async () => {
+    const res = await pluginServer.transform(fileSource, 'file.ts') as any
+    expect(res.code.trim()).toBe('export default null;')
+  })
+
+  it('keeps function for matching side', async () => {
+    const res = await pluginServer.transform(funcSource, 'func.ts') as any
+    expect(res.code).toContain('function foo()')
+    expect(res.code).not.toContain('use server')
+    expect(res.code).not.toContain('bar') // bar should be removed on server
+  })
+
+  it('removes function for opposite side', async () => {
+    const res = await pluginClient.transform(funcSource, 'func.ts') as any
+    expect(res.code).toContain('bar')
+    expect(res.code).not.toContain('foo')
+  })
+})

package/tsconfig.json

@@ -0,0 +1,17 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "module": "ESNext",
+    "moduleResolution": "node",
+    "declaration": true,
+    "outDir": "dist",
+    "rootDir": "src",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "types": ["node"]
+  },
+  "include": ["src/**/*"],
+  "exclude": ["node_modules", "dist"]
+} 

package/vite.config.ts

@@ -0,0 +1,43 @@
+import { defineConfig } from 'vite'
+import dts from 'vite-plugin-dts'
+
+// List of Node.js built-in modules to mark as external
+const nodeBuiltins = [
+  'fs', 'path', 'os', 'crypto', 'util', 'events', 'stream', 'buffer', 
+  'url', 'querystring', 'http', 'https', 'net', 'tls', 'child_process',
+  'cluster', 'dgram', 'dns', 'domain', 'readline', 'repl', 'tty', 'vm',
+  'zlib', 'assert', 'constants', 'module', 'perf_hooks', 'process',
+  'punycode', 'string_decoder', 'timers', 'trace_events', 'v8', 'worker_threads'
+]
+
+export default defineConfig({
+  plugins: [
+    dts({ 
+      include: ['src/**/*.ts'],
+      outDir: 'dist'
+    })
+  ],
+  build: {
+    target: 'esnext',
+    sourcemap: true,
+    minify: false,
+    lib: {
+      entry: 'src/index.ts',
+      formats: ['es'],
+      fileName: 'index'
+    },
+    rollupOptions: {
+      external: [
+        // Mark all Node.js built-in modules as external
+        ...nodeBuiltins,
+        // Also mark any module that starts with 'node:' as external
+        /^node:/,
+        // Mark vite as external since it's a peer dependency
+        'vite',
+        'vite-plugin-dts',
+        '@canvasengine/compiler',
+        'chokidar'
+      ]
+    }
+  },
+})