cawa-93/unplugin-auto-expose

Plugins for automatic exposeInMainWorld everything you exported from preload and easily importing exposed api in renderer

Note

Due to the ongoing war resulting from Russia's full-scale invasion of Ukraine, I currently lack the time for the full development of this open-source project. My primary focus is on ensuring the well-being of myself and my family. I'll prioritize and review all new contributions as soon as possible.

If you can, please consider supporting Ukraine or me personally.

Thank you for your understanding and support.

---

unplugin-auto-expose

Plugins for automatic exposeInMainWorld. Easily export your exposed api from preload to renderer.

Example

// preload.ts
export const foo = 'foo string'
// Equivalent
electron.contextBridge.exposeInMainWorld('__electron_preload_foo', 'foo string')

// renderer.ts
import {foo} from '#preload'
// Equivalent
const foo = window.__electron_preload_foo

Supports all export declaration

// Export named declaration
export const prop = 1
export function method() {}

// Named Re-export
export {prop} from 'file'
export {prop as propAlias} from 'file'

// Export all declaration
export * from 'file'
export * as props from 'file'

// Default exports
export default 'foo'

Configuration

This package contains two plugins: one for preload and one for renderer builds.

// preload/vite.config.ts

import {preload} from 'unplugin-auto-expose';

export default defineConfig({
  plugins: [
    preload.vite()
  ]
})

// renderer/vite.config.ts

import {renderer} from 'unplugin-auto-expose';

export default defineConfig({
  plugins: [
    renderer.vite({
      preloadEntry: '/absolute/path/to/preload.ts'
    })
  ]
})

TypeScript

To configure the TypeScript, add a path to your renderer.

// tsconfig.json`:
{
  "compilerOptions": {
    "paths": {
      "#preload": [
        "/path/to/preload"
      ]
    }
  }
}

unplugin-auto-expose's Issues

[email protected]: Please use @jridgewell/sourcemap-codec instead

Hello! I am using your excellent vite-electron-builder and am presented with the above deprecation each time I update.

I notice that the magic-strings dependency (which itself depends on sourcemap-codec) has been updated in package.json to the latest version. Is there a chance of a new release?

Action Required: Fix Renovate Configuration

There is an error with this repository's Renovate configuration that needs to be fixed. As a precaution, Renovate will stop PRs until it is resolved.

Error type: Cannot find preset's package (:onlyNpm)

traverse is not a function

I am trying to use this updated (0.2.x) package in my electron app, which is based on your vite-electron-builder boilerplate. It was working well in the previous version (0.0.5), but now when running the app in dev mode (npm run watch) I get an error in the console:

[unplugin-auto-expose-preload] traverse is not a function

and the app fails to render anything on launch. I'm running on Node 20.11 with Typescript 5.3.3 and Vite 5.0.12.

This seems to be a CommonJS/ESM issue, as I can fix it by hacking the index.mjs file and change:

32: import traverse from "@babel/traverse";

to:

32: import $traverse from "@babel/traverse";
33: const traverse = $traverse.default;

As this is more of a problem with ESM & CommonJS mixing together, I figured that changing settings in tsconfig.json would help (like adding allowSyntheticDefaultImports: true and esModuleInterop: true), but it didn't.

I'm wondering if you have any insight into how to fix this problem I'm sure you know all about the pain of mixing CJS & ESM in an Electron project.

How can I build types of electron API and publish to npm?

THX for this awesome lib! BTW, Is there any way to export declaration of electron API and publish it to the npm?

Missing methods when exporting `ipcRenderer` from the *preload*

When I export the ipcRenderer from the preload script (I am using your template for Electron + Vite + TypeScript), why can't I use the .on methods. Only some methods are exported along with it.

Write tests

Tests must be written

Sourcemap is likely to be incorrect: a plugin (unplugin-auto-expose-preload) was used to transform files, but didn't generate a sourcemap for the transformation

I'm getting this message : rendering chunks (1)...Sourcemap is likely to be incorrect: a plugin (unplugin-auto-expose-preload) was used to transform files, but didn't generate a sourcemap for the transformation. Consult the plugin documentation for help :

(base) raphy@pc:~/ViteElectronReactBuilder$ yarn run watch
yarn run v1.22.18
$ node scripts/watch.js
vite v3.0.0-alpha.11 building SSR bundle for development...

watching for file changes...

build started...
✓ 3 modules transformed.
rendering chunks (1)...Sourcemap is likely to be incorrect: a plugin (unplugin-auto-expose-preload) was used to transform files, but didn't generate a sourcemap for the transformation. Consult the plugin documentation for help

In ViteElectronReactBuilder/packages/preload/vite.config.js :

import {chrome} from '../../.electron-vendors.cache.json';
import {preload} from 'unplugin-auto-expose';

const PACKAGE_ROOT = __dirname;

/**
 * @type {import('vite').UserConfig}
 * @see https://vitejs.dev/config/
 */
const config = {
  mode: process.env.MODE,
  root: PACKAGE_ROOT,
  envDir: process.cwd(),
  build: {
    ssr: true,
    sourcemap: 'inline',
    target: `chrome${chrome}`,
    outDir: 'dist',
    assetsDir: '.',
    minify: process.env.MODE !== 'development',
    lib: {
      entry: 'src/index.ts',
      formats: ['cjs'],
    },
    rollupOptions: {
      output: {
        entryFileNames: '[name].cjs',
      },
    },
    emptyOutDir: true,
    brotliSize: false,
  },
  plugins: [
    preload.vite(),
  ],
};

export default config;

In ViteElectronReactBuilder/packages/renderer/vite.config.js :

/* eslint-env node */

import {chrome} from '../../.electron-vendors.cache.json';
import {join} from 'path';
import react from '@vitejs/plugin-react';
import {renderer} from 'unplugin-auto-expose';

const PACKAGE_ROOT = __dirname;

/**
 * @type {import('vite').UserConfig}
 * @see https://vitejs.dev/config/
 */
const config = {
  mode: process.env.MODE,
  root: PACKAGE_ROOT,
  resolve: {
    alias: {
      '/@/': join(PACKAGE_ROOT, 'src') + '/',
    },
  },
  base: '',
  server: {
    fs: {
      strict: true,
    },
  },
  build: {
    sourcemap: true,
    target: `chrome${chrome}`,
    outDir: 'dist',
    assetsDir: '.',
    rollupOptions: {
      input: join(PACKAGE_ROOT, 'index.html'),
    },
    emptyOutDir: true,
    brotliSize: false,
  },
  test: {
    environment: 'happy-dom',
  },
  plugins: [
    react(),
    renderer.vite({
      preloadEntry: join(PACKAGE_ROOT, '../preload/src/index.ts'),
    })
  ],
};

export default config;

You can find the repo here: You can find the repo here: https://github.com/raphael10-collab/ViteElectronReactBuilder

How to solve the issue?