vue.jsvuejs3delimitermustachecompiler-options

How to configure delimiters in vue.js version 3+ using build tools?


I was stuck with this for a while.

The official site gave this:

// Delimiters changed to ES6 template string style
app.config.compilerOptions.delimiters = ['${', '}']

but it doesn't work for build setup only as mentioned in the site.. it only works for standalone vue.js


Solution

  • Posting @Emperorsum's own answer here:

    Anyway this finally worked:

    Editing vite.config.js thus:

    // https://vitejs.dev/config/
    export default defineConfig({
      plugins: [vue({
        template:{
          compilerOptions: {
            delimiters: ["[[","]]"]
          }
        }
      })],
      resolve: {
        alias: {
          '@': fileURLToPath(new URL('./src', import.meta.url))    
        }
      },
    })