I'm having trouble trying to get the autocomplete of vuetify components. v-card for example.
I'm running PhpStorm 2018.2.4 on Windows 10. I have the Vue.js plugin installed.
It can be related to Vuetify version being used; the way components are defined has been changed in 1.1+, and this new format is not yet supported (WEB-32886). Please follow this ticket for updates.
See https://github.com/vuetifyjs/vuetify/issues/4590#issuecomment-414300395 for possible workaround
Related
As you can see below, the import is not highlited even though the component SearchBar is been used.
I've tried fixing this problem by installing the Vetur and Vue 3 Support - All In One extensions, but they don't fix it.
I would appreciate if someone could help me solve this.
Use Vue Volar extension Pack extension instead of Vetur
This is the official Vue.js language feature extension for VS Code
I am trying to build a VueJS webapp that has the whole VSCode editor embedded inside of it similar to codesandbox. What part of the vscode codebase do we need in order to get the entire VSCode running inside of VueJS?
So my idea was that I would have a navbar and underneath the navbar I would have the VSCode Editor.
You don't need VS code codebase, since it wouldn't work out of the box in the browser, like you want to. Take a look at Monaco editor, it is basically VS Code editor for browsers.
I bought and installed TailwindUI. I copied and pasted one of the Navigation components just to see how it looks in the app and the hamburger menu and the notification bell (both part of Heroicons) aren't appearing.
When I click on the part where the menu should dropdown it works. But all that's present is a little square that sort of looks like a checkbox.
Here is what it looks like in Firefox (mobile debugger):
Testing on Safari and it looks like Chrome.
In node_modules I can see heroicons are present:
The app uses Elixir/Phoenix, Vue, Webpack, and Tailwindcss.
Anyone know what the issue is or how I'd go about debugging it?
If you are not using SVG syntax, you have to install and import #heroicons/react package into your project using npm/yarn
npm install #heroicons/react
TailwindUI supports Vue 3, which does not appear to include #vue/compat. #vue/compat is a compatibility build for when one wants to migrate from Vue 2 to Vue 3. the compat build (aka, migration build) is supposed to be Vue 3 compatible but I guess it's still not enough for TailwindUI.
Has anyone used VUETIFY with this tool vue-sfc-rollup?
https://www.npmjs.com/package/vue-sfc-rollup
I need to add VUETIFY to the project that tool created, but using the VUE CLI command VUE ADD VUETIFY will not work due to the fact that the rollup solution is not a complete vuejs application, but a compact solution for creating distributed components. The problem I am trying to solve is where do I add the vuetify specific code?
Im using vuetify and intellij editor - and cannot make autocomplete to work
I have added vuetify css and js like below
preferences > templates and languages > (added paths to vuetify css and js)
Vuetify components are supported since 2017.3.2 (see https://youtrack.jetbrains.com/issue/WEB-28318#comment=27-2578795) - just make sure that vuetify is installed in your project (npm i vuetify --save) and Vue.js plugin is installed and enabled.
See https://blog.jetbrains.com/webstorm/2018/01/working-with-vue-js-in-webstorm/ for more info.
Vuetify mixins and directives are not yet supported, please follow WEB-30070 for updates