如何更改 vue-cli 的分隔符?

2023-11-30

我安装了 vue-cli (webpack-simple)

src/main.js:

import Vue from 'vue'
import App from './App.vue'

new Vue({
  delimiters: ['?{', '}'],     // here , delimiters set " ?{ } " 
  el: '#app',
  render: h => h(App)
})

上面的代码不起作用(?{}), {}继续工作

/src/App.vue代码更改

<template>
  <div id="app">
    ?{ msg }
  </div>
</template>

<script>
export default {
  name: "app",
  delimiters: ["?{", "}"], // here , delimiters set " ?{ } " 
  data() {
    return {
      msg: "Welcome to Your Vue.js App"
    };
  }
};
</script>

索引.html(不工作):

<div>  ?{ msg }  </div>

我想打印“欢迎使用您的 Vue.js 应用程序”

help me

谢谢你!!


参见作者的回复:

仅当使用完整构建 (vue.js) 的运行时编译时才能更改分隔符。它不适用于 *.vue 文件(以保持所有 *.vue 文件语法一致)

Vue 2.5.1 组件自定义分隔符不起作用 #5697


[2020/07/03]

如何配置使用运行时编译器来使用自定义分隔符

  1. 创建一个vue.config.js文件位于项目根目录(您存储的位置package.json)

  2. 添加内容如下:

// vue.config.js
module.exports = {
  runtimeCompiler: true
}
  1. Delete <template /> at app.vue
  2. 修改<script /> at app.vue如下:
// app.vue
<script>
export default {
    delimiters: ['{', '}'],
    name: 'App',
    template: '<div id="app">{ title }</div>',
    data () {
        return {
            title: 'This is a Title'
        };
    }
};
</script>
  1. 该文件配置参考#runtimeCompiler
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何更改 vue-cli 的分隔符? 的相关文章

随机推荐