CODEWITHSUNDEEP
javascriptvue.jsvuejs2
caimaoy
caimaoy

Reputation: 1228

How to set global delimiters in Vue.js 2.0?

In Vue.js 1.0, I can set global delimiters by the following codes

Vue.config.delimiters = ['${', '}'];

But It was removed from Vue.js 2.0. Must I use the following codes to set delimiters every time?

new Vue({
  delimiters: ['${', '}']
})

Upvotes: 3

Views: 4510

Answers (3)

Vishal
Vishal

Reputation: 1272

For Vue2, try it like this:

Vue.options.delimiters = ['${', '}'];

Upvotes: 8

Michał Kutra
Michał Kutra

Reputation: 1202

But what about simple workaround. You can prepare class, const or any kind of config like:

VueConfig.js

export const VueConfig = { delimiters: ['${', '}'] };

and then on your App.js you simply do

```

import {VueConfig} from './VueConfig';

new Vue(
    Object.assign(VueConfig, {
        el: '#app',
        data: {
            msg: 'Oh my app',
        }
    })
);

```

Effect is like here: http://take.ms/wiPGR

Upvotes: 0

craig_h
craig_h

Reputation: 32714

As far as I'm aware there is no way to set the delimiters globally, here's the explanation why:

...in 2.0 delimiters will become a component-level option, which means you only need to set it for the root instance that relies on in-DOM templates. Any components processed by vueify or vue-loader can just keep using default delimiters.

The change is intended to make it easier to use 3rd party components, since changing the delimiters globally means you will not be able to compile them correctly.

Source: https://github.com/vuejs/vue-cli/issues/100

Upvotes: 4

Related Questions