Working with Build Tools

Vite Configuration

OMD works seamlessly with Vite. Here is a standard configuration.

// vite.config.js
import { defineConfig } from 'vite';

export default defineConfig({
  build: {
    target: 'esnext', // OMD uses modern JS features
  },
  optimizeDeps: {
    include: ['@teachinglab/omd']
  }
});

Webpack Configuration

If you are using Webpack, ensure you handle ES modules correctly.

// webpack.config.js
module.exports = {
  // ...
  module: {
    rules: [
      {
        test: /\.m?js$/,
        resolve: {
          fullySpecified: false // Handle .mjs imports
        }
      }
    ]
  }
};

Troubleshooting

If you encounter issues with imports, make sure your project is set to "type": "module" in package.json.