Version

3.2.23

Reproduction link

stackblitz.com

Steps to reproduce

Call the compile function with a template containing references to global properties. For example:

compile('<div :class="$divclass">This is an example</div>')

where $divclass has been defined as a globalProperty by a call to app.config.globalProperties.$divclass='myclass'

What is expected?

The reference is found

What is actually happening?

The compiler exits with an error: Uncaught (in promise) ReferenceError: $divclass is not defined

It looks like the component instance is not available to the compiled template. If I do

compile('<div @click="$emit('clicked')">Click me!</div>') 

the compilation succeed but when I click I have the following error: Uncaught ReferenceError: $emit is not defined

Maybe it is an expected behavior due to a technical limitation?

compile() returns a function meant to be used as the render function of a component. it does not return a component object and can't be passed to h().

import { compile } from 'vue';

export default {
  name: 'Compiled',
  setup() {
    return {};
  },
  render: compile('<div :class="$divclass">This is an example</div>'),
};

You can create a component inline like this:

<script>
import { compile,h } from 'vue';
export default {
  name: "Compiled",
  setup() {
    return ()=>h({ 
      render: compile('<div :class="$divclass">This is an example</div>')
    });
  }
}  
</script>

Thank you Linus for the help and sorry for the false issue