abu abu
abu abu

Reputation: 7062

DevTools in vue.js

I am using vue.js inside Laravel 5.5.33 (not SPA). I am getting below error.

enter image description here

How can I enable DevTools?

Upvotes: 0

Views: 607

Answers (3)

Nymau
Nymau

Reputation: 144

Be sure you have this setting in your app.js file

Vue.config.devtools = true

If you are using mix, check the dist of vue in webpack.mix, be sure you don't use min version

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css')
    .webpackConfig({
        resolve: {
            alias: {
                'vue$': 'vue/dist/vue.js'
            }
        }
    });

Run your npm in dev

npm run watch

WARNING If you refresh your page in your browser, the cache is not refreshed. Clean the cache to reload the app.js

Upvotes: 2

Yevhenii Herasymchuk
Yevhenii Herasymchuk

Reputation: 2137

But, for me, the problem with DevTools was solved just when I put the line that is provided in the answer below after creating your Vue application.

Your code should look like this

new Vue({
 el: '#app',
 data () {
   text: 'testData'
 }
})

Vue.config.devtools = true

Upvotes: 0

This is an old issue when production grade build is used.

You are probably using Vue from CDN, and probably using a production build (dist/vue.min.js). Either replace it with a dev build (dist/vue.js) or add Vue.config.devtools = true to the main js file.

Check out the github link.

Upvotes: 0

Related Questions