nuxt-runtime-compiler

A simple module to enable vue runtime bundle on Nuxt 2 and 3

🚀 Runtime bundle can now be enabled in Nuxt 3.4 with experimental.runtimeVueCompiler and vue.runtimeCompiler in Nuxt 3.5 .

Configuration

Add the module to nuxt config file:

nuxt.config.ts

export default defineNuxtConfig({
    modules: ['nuxt-runtime-compiler']
})

Options

The module has some options built-in

interface NuxtRuntimeCompilerOptions {
  nodeModulesRoot?: string
}

nodeModulesRoot

You can specify the node_modules root directory if your node_modules directory is not at your process.cwd().

• Default value is ./

For example if you are running nuxt build from a project in root/packages/{YOUR_WORKSPACE} while your node_modules is in root/ then the nodeModulesRoot should be

export default defineNuxtConfig({
    modules: ['nuxt-runtime-compiler', {
        nodeModulesRoot: "../../"
    }]
})

RuntimeCompilerOptions

See app.config documentation This module overloads the AppConfig exported by app.config.ts to pass the RuntimeCompilerOptions to your VueApp in runtime.

Compatible options from RuntimeCompilerOptions in app.config will also be used by the builder during build time.

app.config.ts

export default defineAppConfig({
  vue: {
    compilerOptions: {
      isCustomElement: (tag) => {
        return [
          'math',
          'maction',
        ].includes(tag)
      }
    }
  }
})