DevTools in vue.js

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

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.

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