Skip to content

[@vue/compiler-sfc] ::v-deep usage as a combinator has been deprecated. Use :deep(<inner-selector>) instead. #17

Closed
@martinszeltins

Description

@martinszeltins

I installed a new Vue 3 + Vite.js app and used the example from the README and it is giving me this warning:

[@vue/compiler-sfc] ::v-deep usage as a combinator has been deprecated. Use :deep() instead.

Here is my App.vue

<template>
  <div> <vue-file-toolbar-menu :content="my_menu" /> </div>
</template>

<script>
import VueFileToolbarMenu from 'vue-file-toolbar-menu'

export default {
  components: { VueFileToolbarMenu },

  data () { return { happy: false } },

  computed: {
    my_menu () {
      return [
        { text: "My Menu", menu: [
          { text: "Item 1", click: () => alert("Action 1") },
          { text: "Item 2", click: () => alert("Action 2") }
        ] }, {
          text: "My Button",
          active: this.happy,
          icon: this.happy ? "sentiment_very_satisfied" : "sentiment_satisfied",
          click: () => { this.happy = !this.happy }
        }
      ]
    }
  }
}
</script>

and my package.json:

{
  "name": "my-vue-app",
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "vue": "^3.2.25",
    "vue-file-toolbar-menu": "^2.0.1"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^2.0.0",
    "sass": "^1.49.7",
    "vite": "^2.7.2"
  }
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions