问题:
vue创建项目后,在js中使用render
函数渲染template模板,报错
代码:
<script>
export default {
methods: {
},
render(h) {
let MyComponent = {
template:"<h3>我就一个组件而已</h3>",
};
return h(MyComponent)
}
}
</script>
vue.runtime.esm.js:4605 [Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.
found in
---> <Anonymous>
<CustomPop> at src/components/CustomPop.vue
<App> at src/App.vue
<Root>
原因分析:
在项目配置的时候,默认 npm
包导出的是运行时构建,即 runtime
版本,不支持编译 template
模板。
vue
在初始化项目配置的时候,有两个运行环境配置的版本:Compiler
版本、Runtime
版本。
解决办法:
vue.config.js
配置文件中设置
runtimeCompiler: true
const {
defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
runtimeCompiler: true
})
然后重启
完美解决