[Bug Report][3.0.0-alpha.0] the code (main.ts) auto-generated by installation doesn't work due to missing components + prettier errors

[sinisarudan]

Environment

Vuetify Version: 3.0.0-alpha.0 Vue Version: 3.2.29 Browsers: Chrome 98.0.4758.102 OS: Mac OS 10.15.7

Steps to reproduce

Install Vuetify 3 (Alpha) following the official https://next.vuetifyjs.com/en/getting-started/installation/ After starting the auto-generated app, it fails due to Run time warnings.

Expected Behavior

/* The correct auto-generated version should be:

import "vuetify/styles"; // Global CSS has to be imported //according to https://next.vuetifyjs.com/en/getting-started/installation/ import { createApp } from "vue"; import { createVuetify } from "vuetify"; import App from "./App.vue"; import as components from "vuetify/components"; import as directives from "vuetify/directives";

const app = createApp(App); const vuetify = createVuetify({ components, directives, });

app.use(vuetify).mount("#app"); */

Actual Behavior

/ main.ts demo auto-generated after Vuetify 3 installation, Vuetify 3 Preview (Vuetify 3) preset, goes like this: /

import { createApp } from 'vue' import App from './App.vue' import vuetify from './plugins/vuetify' import { loadFonts } from './plugins/webfontloader'

loadFonts()

const app = createApp(App) app.use(vuetify).mount('#app')

/* the above version is missing components and thus rising errors:

• runtime-core.esm-bundler.js:38 [Vue warn]: Failed to resolve component: v-main If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.,

• Failed to resolve component: v-app, etc

It is also missing ; at the end of commands. It raises prettier errors due to using ' instead of " */

Reproduction Link

https://codepen.io/sinisa_rudan/pen/vYWRwbz

Other comments

These warnings leading to failure prevents newcomers to use Vuetify

[ElijahKotyluk]

You should make sure this is the resolved version for Vuetify: 3.0.0-alpha.12 in your lock file. You should not be importing the directives and components anymore, they are included automatically if you are using the latest alpha. Here is a repository generated from vue-cli(4.5.x): https://github.com/ElijahKotyluk/vuetify-3-cli.

[sinisarudan]

Yes, that is the resolved version. This the entry in my yarn.lock file:

vuetify@^3.0.0-alpha.0:
  version "3.0.0-alpha.12"
  resolved "https://registry.yarnpkg.com/vuetify/-/vuetify-3.0.0-alpha.12.tgz#c781ebf16a9bb89dd8dfd27c1848efd534545336"
  integrity sha512-F9TwV3Xk6J/bSH422kATrKeIiumGRkzGJPsvM0/8vPwYF0HWh7dHRhhYsIKkfhl5UJl/LYdeGNm1L8+jtldA0w==

And when I try to use the main.ts available at https://github.com/ElijahKotyluk/vuetify-3-cli, the error reappears.

[ElijahKotyluk]

Can you push up a git repository that I can pull down and take a look at?