create-vuetify 1.0.7 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. package/dist/output.cjs +7 -3
  2. package/package.json +1 -1
  3. package/template/javascript/base/README.md +12 -0
  4. package/template/javascript/base/package.json +4 -4
  5. package/template/javascript/base/src/components/HelloWorld.vue +1 -1
  6. package/template/javascript/base/src/plugins/index.js +0 -2
  7. package/template/javascript/base/vite.config.js +10 -1
  8. package/template/javascript/custom/router/src/plugins/index.js +0 -2
  9. package/template/javascript/custom/router-pinia/src/plugins/index.js +0 -2
  10. package/template/javascript/custom/store/src/plugins/index.js +0 -2
  11. package/template/javascript/default/README.md +9 -0
  12. package/template/javascript/default/package.json +3 -3
  13. package/template/javascript/default/src/components/HelloWorld.vue +1 -1
  14. package/template/javascript/default/src/plugins/index.js +0 -2
  15. package/template/javascript/default/vite.config.js +10 -1
  16. package/template/javascript/essentials/README.md +12 -0
  17. package/template/javascript/essentials/package.json +4 -4
  18. package/template/javascript/essentials/src/components/HelloWorld.vue +1 -1
  19. package/template/javascript/essentials/src/plugins/index.js +0 -2
  20. package/template/javascript/essentials/vite.config.js +10 -1
  21. package/template/typescript/base/README.md +12 -0
  22. package/template/typescript/base/package.json +4 -5
  23. package/template/typescript/base/src/components/HelloWorld.vue +1 -1
  24. package/template/typescript/base/src/plugins/index.ts +0 -2
  25. package/template/typescript/base/vite.config.ts +10 -1
  26. package/template/typescript/custom/router/src/plugins/index.ts +0 -2
  27. package/template/typescript/custom/router-pinia/src/plugins/index.ts +0 -2
  28. package/template/typescript/custom/store/src/plugins/index.ts +0 -2
  29. package/template/typescript/default/README.md +9 -0
  30. package/template/typescript/default/package.json +4 -5
  31. package/template/typescript/default/src/components/HelloWorld.vue +1 -1
  32. package/template/typescript/default/src/plugins/index.ts +0 -2
  33. package/template/typescript/default/vite.config.ts +10 -1
  34. package/template/typescript/essentials/README.md +12 -0
  35. package/template/typescript/essentials/package.json +4 -5
  36. package/template/typescript/essentials/src/components/HelloWorld.vue +1 -1
  37. package/template/typescript/essentials/src/plugins/index.ts +0 -2
  38. package/template/typescript/essentials/vite.config.ts +10 -1
  39. package/template/javascript/base/src/plugins/webfontloader.js +0 -15
  40. package/template/javascript/default/src/plugins/webfontloader.js +0 -15
  41. package/template/javascript/essentials/src/plugins/webfontloader.js +0 -15
  42. package/template/typescript/base/src/plugins/webfontloader.ts +0 -15
  43. package/template/typescript/default/src/plugins/webfontloader.ts +0 -15
  44. package/template/typescript/essentials/src/plugins/webfontloader.ts +0 -15
package/dist/output.cjs CHANGED
@@ -14,7 +14,10 @@ var __copyProps = (to, from, except, desc) => {
14
14
  }
15
15
  return to;
16
16
  };
17
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
17
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
18
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
19
+ mod
20
+ ));
18
21
 
19
22
  // src/index.ts
20
23
  var import_path3 = require("path");
@@ -118,12 +121,13 @@ var promptQuestions = (context) => [
118
121
  {
119
122
  name: "usePackageManager",
120
123
  type: "select",
121
- message: "Would you like to install dependencies with yarn, npm, or pnpm?",
124
+ message: "Would you like to install dependencies with yarn, npm, pnpm, or bun?",
122
125
  initial: 0,
123
126
  choices: [
124
127
  { title: "yarn", value: "yarn" },
125
128
  { title: "npm", value: "npm" },
126
129
  { title: "pnpm", value: "pnpm" },
130
+ { title: "bun", value: "bun" },
127
131
  { title: "none", value: null }
128
132
  ]
129
133
  }
@@ -154,7 +158,7 @@ var import_minimist = __toESM(require("minimist"), 1);
154
158
  // src/utils/installDependencies.ts
155
159
  var import_child_process = require("child_process");
156
160
  function installDependencies(projectRoot, packageManager) {
157
- const cmd = packageManager === "npm" ? "npm install" : packageManager === "yarn" ? "yarn" : "pnpm install";
161
+ const cmd = packageManager === "npm" ? "npm install" : packageManager === "yarn" ? "yarn" : packageManager === "bun" ? "bun install" : "pnpm install";
158
162
  const spawn = (0, import_child_process.spawnSync)(cmd, {
159
163
  cwd: projectRoot,
160
164
  stdio: ["inherit", "inherit", "pipe"],
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-vuetify",
3
- "version": "1.0.7",
3
+ "version": "1.1.0",
4
4
  "main": "dist/output.cjs",
5
5
  "author": "Elijah Kotyluk <elijah@elijahkotyluk.com>",
6
6
  "license": "MIT",
@@ -11,6 +11,9 @@ npm install
11
11
 
12
12
  # pnpm
13
13
  pnpm install
14
+
15
+ # pnpm
16
+ bun install
14
17
  ```
15
18
 
16
19
  ### Compiles and hot-reloads for development
@@ -24,6 +27,9 @@ npm run dev
24
27
 
25
28
  # pnpm
26
29
  pnpm dev
30
+
31
+ # bun
32
+ bun run dev
27
33
  ```
28
34
 
29
35
  ### Compiles and minifies for production
@@ -37,6 +43,9 @@ npm run build
37
43
 
38
44
  # pnpm
39
45
  pnpm build
46
+
47
+ # bun
48
+ bun run build
40
49
  ```
41
50
 
42
51
  ### Lints and fixes files
@@ -50,6 +59,9 @@ npm run lint
50
59
 
51
60
  # pnpm
52
61
  pnpm lint
62
+
63
+ # bun
64
+ bun run lint
53
65
  ```
54
66
 
55
67
  ### Customize configuration
@@ -13,15 +13,15 @@
13
13
  "roboto-fontface": "*",
14
14
  "vue": "^3.2.0",
15
15
  "vue-router": "^4.0.0",
16
- "vuetify": "^3.0.0",
17
- "webfontloader": "^1.0.0"
16
+ "vuetify": "^3.0.0"
18
17
  },
19
18
  "devDependencies": {
20
- "@vitejs/plugin-vue": "^3.0.3",
19
+ "@vitejs/plugin-vue": "^4.0.0",
21
20
  "eslint": "^8.37.0",
22
21
  "eslint-plugin-vue": "^9.3.0",
23
22
  "sass": "^1.60.0",
24
23
  "vite": "^4.2.0",
25
- "vite-plugin-vuetify": "^1.0.0"
24
+ "vite-plugin-vuetify": "^1.0.0",
25
+ "unplugin-fonts": "^1.0.3"
26
26
  }
27
27
  }
@@ -1,6 +1,6 @@
1
1
  <template>
2
2
  <v-container class="fill-height">
3
- <v-responsive class="d-flex align-center text-center fill-height">
3
+ <v-responsive class="align-center text-center fill-height">
4
4
  <v-img height="300" src="@/assets/logo.svg" />
5
5
 
6
6
  <div class="text-body-2 font-weight-light mb-n1">Welcome to</div>
@@ -5,12 +5,10 @@
5
5
  */
6
6
 
7
7
  // Plugins
8
- import { loadFonts } from './webfontloader'
9
8
  import vuetify from './vuetify'
10
9
  import router from '../router'
11
10
 
12
11
  export function registerPlugins (app) {
13
- loadFonts()
14
12
  app
15
13
  .use(vuetify)
16
14
  .use(router)
@@ -1,6 +1,7 @@
1
1
  // Plugins
2
2
  import vue from '@vitejs/plugin-vue'
3
3
  import vuetify, { transformAssetUrls } from 'vite-plugin-vuetify'
4
+ import ViteFonts from 'unplugin-fonts/vite'
4
5
 
5
6
  // Utilities
6
7
  import { defineConfig } from 'vite'
@@ -9,7 +10,7 @@ import { fileURLToPath, URL } from 'node:url'
9
10
  // https://vitejs.dev/config/
10
11
  export default defineConfig({
11
12
  plugins: [
12
- vue({
13
+ vue({
13
14
  template: { transformAssetUrls }
14
15
  }),
15
16
  // https://github.com/vuetifyjs/vuetify-loader/tree/next/packages/vite-plugin
@@ -19,6 +20,14 @@ export default defineConfig({
19
20
  configFile: 'src/styles/settings.scss',
20
21
  },
21
22
  }),
23
+ ViteFonts({
24
+ google: {
25
+ families: [{
26
+ name: 'Roboto',
27
+ styles: 'wght@100;300;400;500;700;900',
28
+ }],
29
+ },
30
+ }),
22
31
  ],
23
32
  define: { 'process.env': {} },
24
33
  resolve: {
@@ -5,12 +5,10 @@
5
5
  */
6
6
 
7
7
  // Plugins
8
- import { loadFonts } from './webfontloader'
9
8
  import vuetify from './vuetify'
10
9
  import router from '../router'
11
10
 
12
11
  export function registerPlugins (app) {
13
- loadFonts()
14
12
  app
15
13
  .use(vuetify)
16
14
  .use(router)
@@ -5,13 +5,11 @@
5
5
  */
6
6
 
7
7
  // Plugins
8
- import { loadFonts } from './webfontloader'
9
8
  import vuetify from './vuetify'
10
9
  import pinia from '../store'
11
10
  import router from '../router'
12
11
 
13
12
  export function registerPlugins (app) {
14
- loadFonts()
15
13
  app
16
14
  .use(vuetify)
17
15
  .use(pinia)
@@ -5,12 +5,10 @@
5
5
  */
6
6
 
7
7
  // Plugins
8
- import { loadFonts } from './webfontloader'
9
8
  import vuetify from './vuetify'
10
9
  import pinia from '../store'
11
10
 
12
11
  export function registerPlugins (app) {
13
- loadFonts()
14
12
  app
15
13
  .use(vuetify)
16
14
  .use(pinia)
@@ -11,6 +11,9 @@ npm install
11
11
 
12
12
  # pnpm
13
13
  pnpm install
14
+
15
+ # bun
16
+ bun install
14
17
  ```
15
18
 
16
19
  ### Compiles and hot-reloads for development
@@ -24,6 +27,9 @@ npm run dev
24
27
 
25
28
  # pnpm
26
29
  pnpm dev
30
+
31
+ # bun
32
+ bun run dev
27
33
  ```
28
34
 
29
35
  ### Compiles and minifies for production
@@ -37,6 +43,9 @@ npm run build
37
43
 
38
44
  # pnpm
39
45
  pnpm build
46
+
47
+ # bun
48
+ bun run build
40
49
  ```
41
50
 
42
51
  ### Customize configuration
@@ -10,11 +10,11 @@
10
10
  "roboto-fontface": "*",
11
11
  "vue": "^3.2.0",
12
12
  "vuetify": "^3.0.0",
13
- "webfontloader": "^1.0.0"
14
13
  },
15
14
  "devDependencies": {
16
- "@vitejs/plugin-vue": "^3.0.3",
15
+ "@vitejs/plugin-vue": "^4.0.0",
17
16
  "vite-plugin-vuetify": "^1.0.0",
18
- "vite": "^4.2.0"
17
+ "vite": "^4.2.0",
18
+ "unplugin-fonts": "^1.0.3"
19
19
  }
20
20
  }
@@ -1,6 +1,6 @@
1
1
  <template>
2
2
  <v-container class="fill-height">
3
- <v-responsive class="d-flex align-center text-center fill-height">
3
+ <v-responsive class="align-center text-center fill-height">
4
4
  <v-img height="300" src="@/assets/logo.svg" />
5
5
 
6
6
  <div class="text-body-2 font-weight-light mb-n1">Welcome to</div>
@@ -5,10 +5,8 @@
5
5
  */
6
6
 
7
7
  // Plugins
8
- import { loadFonts } from './webfontloader'
9
8
  import vuetify from './vuetify'
10
9
 
11
10
  export function registerPlugins (app) {
12
- loadFonts()
13
11
  app.use(vuetify)
14
12
  }
@@ -1,6 +1,7 @@
1
1
  // Plugins
2
2
  import vue from '@vitejs/plugin-vue'
3
3
  import vuetify, { transformAssetUrls } from 'vite-plugin-vuetify'
4
+ import ViteFonts from 'unplugin-fonts/vite'
4
5
 
5
6
  // Utilities
6
7
  import { defineConfig } from 'vite'
@@ -9,13 +10,21 @@ import { fileURLToPath, URL } from 'node:url'
9
10
  // https://vitejs.dev/config/
10
11
  export default defineConfig({
11
12
  plugins: [
12
- vue({
13
+ vue({
13
14
  template: { transformAssetUrls }
14
15
  }),
15
16
  // https://github.com/vuetifyjs/vuetify-loader/tree/next/packages/vite-plugin
16
17
  vuetify({
17
18
  autoImport: true,
18
19
  }),
20
+ ViteFonts({
21
+ google: {
22
+ families: [{
23
+ name: 'Roboto',
24
+ styles: 'wght@100;300;400;500;700;900',
25
+ }],
26
+ },
27
+ }),
19
28
  ],
20
29
  define: { 'process.env': {} },
21
30
  resolve: {
@@ -11,6 +11,9 @@ npm install
11
11
 
12
12
  # pnpm
13
13
  pnpm install
14
+
15
+ # bun
16
+ bun install
14
17
  ```
15
18
 
16
19
  ### Compiles and hot-reloads for development
@@ -24,6 +27,9 @@ npm run dev
24
27
 
25
28
  # pnpm
26
29
  pnpm dev
30
+
31
+ # bun
32
+ bun run dev
27
33
  ```
28
34
 
29
35
  ### Compiles and minifies for production
@@ -37,6 +43,9 @@ npm run build
37
43
 
38
44
  # pnpm
39
45
  pnpm build
46
+
47
+ # bun
48
+ bun run build
40
49
  ```
41
50
 
42
51
  ### Lints and fixes files
@@ -50,6 +59,9 @@ npm run lint
50
59
 
51
60
  # pnpm
52
61
  pnpm lint
62
+
63
+ # bun
64
+ bun run lint
53
65
  ```
54
66
 
55
67
  ### Customize configuration
@@ -14,15 +14,15 @@
14
14
  "roboto-fontface": "*",
15
15
  "vue": "^3.2.0",
16
16
  "vue-router": "^4.0.0",
17
- "vuetify": "^3.0.0",
18
- "webfontloader": "^1.0.0"
17
+ "vuetify": "^3.0.0"
19
18
  },
20
19
  "devDependencies": {
21
- "@vitejs/plugin-vue": "^3.0.3",
20
+ "@vitejs/plugin-vue": "^4.0.0",
22
21
  "eslint": "^8.37.0",
23
22
  "eslint-plugin-vue": "^9.3.0",
24
23
  "sass": "^1.60.0",
25
24
  "vite": "^4.2.0",
26
- "vite-plugin-vuetify": "^1.0.0"
25
+ "vite-plugin-vuetify": "^1.0.0",
26
+ "unplugin-fonts": "^1.0.3"
27
27
  }
28
28
  }
@@ -1,6 +1,6 @@
1
1
  <template>
2
2
  <v-container class="fill-height">
3
- <v-responsive class="d-flex align-center text-center fill-height">
3
+ <v-responsive class="align-center text-center fill-height">
4
4
  <v-img height="300" src="@/assets/logo.svg" />
5
5
 
6
6
  <div class="text-body-2 font-weight-light mb-n1">Welcome to</div>
@@ -5,13 +5,11 @@
5
5
  */
6
6
 
7
7
  // Plugins
8
- import { loadFonts } from './webfontloader'
9
8
  import vuetify from './vuetify'
10
9
  import pinia from '../store'
11
10
  import router from '../router'
12
11
 
13
12
  export function registerPlugins (app) {
14
- loadFonts()
15
13
  app
16
14
  .use(vuetify)
17
15
  .use(router)
@@ -1,6 +1,7 @@
1
1
  // Plugins
2
2
  import vue from '@vitejs/plugin-vue'
3
3
  import vuetify, { transformAssetUrls } from 'vite-plugin-vuetify'
4
+ import ViteFonts from 'unplugin-fonts/vite'
4
5
 
5
6
  // Utilities
6
7
  import { defineConfig } from 'vite'
@@ -9,7 +10,7 @@ import { fileURLToPath, URL } from 'node:url'
9
10
  // https://vitejs.dev/config/
10
11
  export default defineConfig({
11
12
  plugins: [
12
- vue({
13
+ vue({
13
14
  template: { transformAssetUrls }
14
15
  }),
15
16
  // https://github.com/vuetifyjs/vuetify-loader/tree/next/packages/vite-plugin
@@ -19,6 +20,14 @@ export default defineConfig({
19
20
  configFile: 'src/styles/settings.scss',
20
21
  },
21
22
  }),
23
+ ViteFonts({
24
+ google: {
25
+ families: [{
26
+ name: 'Roboto',
27
+ styles: 'wght@100;300;400;500;700;900',
28
+ }],
29
+ },
30
+ }),
22
31
  ],
23
32
  define: { 'process.env': {} },
24
33
  resolve: {
@@ -11,6 +11,9 @@ npm install
11
11
 
12
12
  # pnpm
13
13
  pnpm install
14
+
15
+ # bun
16
+ bun install
14
17
  ```
15
18
 
16
19
  ### Compiles and hot-reloads for development
@@ -24,6 +27,9 @@ npm run dev
24
27
 
25
28
  # pnpm
26
29
  pnpm dev
30
+
31
+ # bun
32
+ pnpm run dev
27
33
  ```
28
34
 
29
35
  ### Compiles and minifies for production
@@ -37,6 +43,9 @@ npm run build
37
43
 
38
44
  # pnpm
39
45
  pnpm build
46
+
47
+ # bun
48
+ pnpm run build
40
49
  ```
41
50
 
42
51
  ### Lints and fixes files
@@ -50,6 +59,9 @@ npm run lint
50
59
 
51
60
  # pnpm
52
61
  pnpm lint
62
+
63
+ # bun
64
+ pnpm run lint
53
65
  ```
54
66
 
55
67
  ### Customize configuration
@@ -13,14 +13,12 @@
13
13
  "roboto-fontface": "*",
14
14
  "vue": "^3.2.0",
15
15
  "vue-router": "^4.0.0",
16
- "vuetify": "^3.0.0",
17
- "webfontloader": "^1.0.0"
16
+ "vuetify": "^3.0.0"
18
17
  },
19
18
  "devDependencies": {
20
19
  "@babel/types": "^7.21.4",
21
20
  "@types/node": "^18.15.0",
22
- "@types/webfontloader": "^1.6.35",
23
- "@vitejs/plugin-vue": "^3.0.3",
21
+ "@vitejs/plugin-vue": "^4.0.0",
24
22
  "@vue/eslint-config-typescript": "^11.0.0",
25
23
  "eslint": "^8.22.0",
26
24
  "eslint-plugin-vue": "^9.3.0",
@@ -28,6 +26,7 @@
28
26
  "typescript": "^5.0.0",
29
27
  "vite": "^4.2.0",
30
28
  "vite-plugin-vuetify": "^1.0.0",
31
- "vue-tsc": "^1.2.0"
29
+ "vue-tsc": "^1.2.0",
30
+ "unplugin-fonts": "^1.0.3"
32
31
  }
33
32
  }
@@ -1,6 +1,6 @@
1
1
  <template>
2
2
  <v-container class="fill-height">
3
- <v-responsive class="d-flex align-center text-center fill-height">
3
+ <v-responsive class="align-center text-center fill-height">
4
4
  <v-img height="300" src="@/assets/logo.svg" />
5
5
 
6
6
  <div class="text-body-2 font-weight-light mb-n1">Welcome to</div>
@@ -5,7 +5,6 @@
5
5
  */
6
6
 
7
7
  // Plugins
8
- import { loadFonts } from './webfontloader'
9
8
  import vuetify from './vuetify'
10
9
  import router from '../router'
11
10
 
@@ -13,7 +12,6 @@ import router from '../router'
13
12
  import type { App } from 'vue'
14
13
 
15
14
  export function registerPlugins (app: App) {
16
- loadFonts()
17
15
  app
18
16
  .use(vuetify)
19
17
  .use(router)
@@ -1,6 +1,7 @@
1
1
  // Plugins
2
2
  import vue from '@vitejs/plugin-vue'
3
3
  import vuetify, { transformAssetUrls } from 'vite-plugin-vuetify'
4
+ import ViteFonts from 'unplugin-fonts/vite'
4
5
 
5
6
  // Utilities
6
7
  import { defineConfig } from 'vite'
@@ -9,7 +10,7 @@ import { fileURLToPath, URL } from 'node:url'
9
10
  // https://vitejs.dev/config/
10
11
  export default defineConfig({
11
12
  plugins: [
12
- vue({
13
+ vue({
13
14
  template: { transformAssetUrls }
14
15
  }),
15
16
  // https://github.com/vuetifyjs/vuetify-loader/tree/next/packages/vite-plugin
@@ -19,6 +20,14 @@ export default defineConfig({
19
20
  configFile: 'src/styles/settings.scss',
20
21
  },
21
22
  }),
23
+ ViteFonts({
24
+ google: {
25
+ families: [{
26
+ name: 'Roboto',
27
+ styles: 'wght@100;300;400;500;700;900',
28
+ }],
29
+ },
30
+ }),
22
31
  ],
23
32
  define: { 'process.env': {} },
24
33
  resolve: {
@@ -5,7 +5,6 @@
5
5
  */
6
6
 
7
7
  // Plugins
8
- import { loadFonts } from './webfontloader'
9
8
  import vuetify from './vuetify'
10
9
  import router from '../router'
11
10
 
@@ -13,7 +12,6 @@ import router from '../router'
13
12
  import type { App } from 'vue'
14
13
 
15
14
  export function registerPlugins (app: App) {
16
- loadFonts()
17
15
  app
18
16
  .use(vuetify)
19
17
  .use(router)
@@ -5,7 +5,6 @@
5
5
  */
6
6
 
7
7
  // Plugins
8
- import { loadFonts } from './webfontloader'
9
8
  import vuetify from './vuetify'
10
9
  import pinia from '../store'
11
10
  import router from '../router'
@@ -14,7 +13,6 @@ import router from '../router'
14
13
  import type { App } from 'vue'
15
14
 
16
15
  export function registerPlugins (app: App) {
17
- loadFonts()
18
16
  app
19
17
  .use(vuetify)
20
18
  .use(router)
@@ -5,7 +5,6 @@
5
5
  */
6
6
 
7
7
  // Plugins
8
- import { loadFonts } from './webfontloader'
9
8
  import vuetify from './vuetify'
10
9
  import pinia from '../store'
11
10
 
@@ -13,7 +12,6 @@ import pinia from '../store'
13
12
  import type { App } from 'vue'
14
13
 
15
14
  export function registerPlugins (app: App) {
16
- loadFonts()
17
15
  app
18
16
  .use(vuetify)
19
17
  .use(pinia)
@@ -11,6 +11,9 @@ npm install
11
11
 
12
12
  # pnpm
13
13
  pnpm install
14
+
15
+ # bun
16
+ bun install
14
17
  ```
15
18
 
16
19
  ### Compiles and hot-reloads for development
@@ -24,6 +27,9 @@ npm run dev
24
27
 
25
28
  # pnpm
26
29
  pnpm dev
30
+
31
+ # bun
32
+ bun run dev
27
33
  ```
28
34
 
29
35
  ### Compiles and minifies for production
@@ -37,6 +43,9 @@ npm run build
37
43
 
38
44
  # pnpm
39
45
  pnpm build
46
+
47
+ # bun
48
+ bun run build
40
49
  ```
41
50
 
42
51
  ### Customize configuration
@@ -9,17 +9,16 @@
9
9
  "@mdi/font": "7.0.96",
10
10
  "roboto-fontface": "*",
11
11
  "vue": "^3.2.0",
12
- "vuetify": "^3.0.0",
13
- "webfontloader": "^1.0.0"
12
+ "vuetify": "^3.0.0"
14
13
  },
15
14
  "devDependencies": {
16
15
  "@babel/types": "^7.21.4",
17
16
  "@types/node": "^18.15.0",
18
- "@types/webfontloader": "^1.6.35",
19
- "@vitejs/plugin-vue": "^3.2.0",
17
+ "@vitejs/plugin-vue": "^4.0.0",
20
18
  "typescript": "^5.0.0",
21
19
  "vite": "^4.2.0",
22
20
  "vite-plugin-vuetify": "^1.0.0",
23
- "vue-tsc": "^1.2.0"
21
+ "vue-tsc": "^1.2.0",
22
+ "unplugin-fonts": "^1.0.3"
24
23
  }
25
24
  }
@@ -1,6 +1,6 @@
1
1
  <template>
2
2
  <v-container class="fill-height">
3
- <v-responsive class="d-flex align-center text-center fill-height">
3
+ <v-responsive class="align-center text-center fill-height">
4
4
  <v-img height="300" src="@/assets/logo.svg" />
5
5
 
6
6
  <div class="text-body-2 font-weight-light mb-n1">Welcome to</div>
@@ -5,13 +5,11 @@
5
5
  */
6
6
 
7
7
  // Plugins
8
- import { loadFonts } from './webfontloader'
9
8
  import vuetify from './vuetify'
10
9
 
11
10
  // Types
12
11
  import type { App } from 'vue'
13
12
 
14
13
  export function registerPlugins (app: App) {
15
- loadFonts()
16
14
  app.use(vuetify)
17
15
  }
@@ -1,6 +1,7 @@
1
1
  // Plugins
2
2
  import vue from '@vitejs/plugin-vue'
3
3
  import vuetify, { transformAssetUrls } from 'vite-plugin-vuetify'
4
+ import ViteFonts from 'unplugin-fonts/vite'
4
5
 
5
6
  // Utilities
6
7
  import { defineConfig } from 'vite'
@@ -9,13 +10,21 @@ import { fileURLToPath, URL } from 'node:url'
9
10
  // https://vitejs.dev/config/
10
11
  export default defineConfig({
11
12
  plugins: [
12
- vue({
13
+ vue({
13
14
  template: { transformAssetUrls }
14
15
  }),
15
16
  // https://github.com/vuetifyjs/vuetify-loader/tree/next/packages/vite-plugin
16
17
  vuetify({
17
18
  autoImport: true,
18
19
  }),
20
+ ViteFonts({
21
+ google: {
22
+ families: [{
23
+ name: 'Roboto',
24
+ styles: 'wght@100;300;400;500;700;900',
25
+ }],
26
+ },
27
+ }),
19
28
  ],
20
29
  define: { 'process.env': {} },
21
30
  resolve: {
@@ -11,6 +11,9 @@ npm install
11
11
 
12
12
  # pnpm
13
13
  pnpm install
14
+
15
+ # bun
16
+ bun install
14
17
  ```
15
18
 
16
19
  ### Compiles and hot-reloads for development
@@ -24,6 +27,9 @@ npm run dev
24
27
 
25
28
  # pnpm
26
29
  pnpm dev
30
+
31
+ # bun
32
+ bun run dev
27
33
  ```
28
34
 
29
35
  ### Compiles and minifies for production
@@ -37,6 +43,9 @@ npm run build
37
43
 
38
44
  # pnpm
39
45
  pnpm build
46
+
47
+ # bun
48
+ bun run build
40
49
  ```
41
50
 
42
51
  ### Lints and fixes files
@@ -50,6 +59,9 @@ npm run lint
50
59
 
51
60
  # pnpm
52
61
  pnpm lint
62
+
63
+ # bun
64
+ bun run lint
53
65
  ```
54
66
 
55
67
  ### Customize configuration
@@ -14,14 +14,12 @@
14
14
  "roboto-fontface": "*",
15
15
  "vue": "^3.2.0",
16
16
  "vue-router": "^4.0.0",
17
- "vuetify": "^3.0.0",
18
- "webfontloader": "^1.0.0"
17
+ "vuetify": "^3.0.0"
19
18
  },
20
19
  "devDependencies": {
21
20
  "@babel/types": "^7.21.4",
22
21
  "@types/node": "^18.15.0",
23
- "@types/webfontloader": "^1.6.35",
24
- "@vitejs/plugin-vue": "^3.0.3",
22
+ "@vitejs/plugin-vue": "^4.0.0",
25
23
  "@vue/eslint-config-typescript": "^11.0.0",
26
24
  "eslint": "^8.37.0",
27
25
  "eslint-plugin-vue": "^9.3.0",
@@ -29,6 +27,7 @@
29
27
  "typescript": "^5.0.0",
30
28
  "vite": "^4.2.0",
31
29
  "vite-plugin-vuetify": "^1.0.0",
32
- "vue-tsc": "^1.2.0"
30
+ "vue-tsc": "^1.2.0",
31
+ "unplugin-fonts": "^1.0.3"
33
32
  }
34
33
  }
@@ -1,6 +1,6 @@
1
1
  <template>
2
2
  <v-container class="fill-height">
3
- <v-responsive class="d-flex align-center text-center fill-height">
3
+ <v-responsive class="align-center text-center fill-height">
4
4
  <v-img height="300" src="@/assets/logo.svg" />
5
5
 
6
6
  <div class="text-body-2 font-weight-light mb-n1">Welcome to</div>
@@ -5,7 +5,6 @@
5
5
  */
6
6
 
7
7
  // Plugins
8
- import { loadFonts } from './webfontloader'
9
8
  import vuetify from './vuetify'
10
9
  import pinia from '../store'
11
10
  import router from '../router'
@@ -14,7 +13,6 @@ import router from '../router'
14
13
  import type { App } from 'vue'
15
14
 
16
15
  export function registerPlugins (app: App) {
17
- loadFonts()
18
16
  app
19
17
  .use(vuetify)
20
18
  .use(router)
@@ -1,6 +1,7 @@
1
1
  // Plugins
2
2
  import vue from '@vitejs/plugin-vue'
3
3
  import vuetify, { transformAssetUrls } from 'vite-plugin-vuetify'
4
+ import ViteFonts from 'unplugin-fonts/vite'
4
5
 
5
6
  // Utilities
6
7
  import { defineConfig } from 'vite'
@@ -9,7 +10,7 @@ import { fileURLToPath, URL } from 'node:url'
9
10
  // https://vitejs.dev/config/
10
11
  export default defineConfig({
11
12
  plugins: [
12
- vue({
13
+ vue({
13
14
  template: { transformAssetUrls }
14
15
  }),
15
16
  // https://github.com/vuetifyjs/vuetify-loader/tree/next/packages/vite-plugin
@@ -19,6 +20,14 @@ export default defineConfig({
19
20
  configFile: 'src/styles/settings.scss',
20
21
  },
21
22
  }),
23
+ ViteFonts({
24
+ google: {
25
+ families: [{
26
+ name: 'Roboto',
27
+ styles: 'wght@100;300;400;500;700;900',
28
+ }],
29
+ },
30
+ }),
22
31
  ],
23
32
  define: { 'process.env': {} },
24
33
  resolve: {
@@ -1,15 +0,0 @@
1
- /**
2
- * plugins/webfontloader.js
3
- *
4
- * webfontloader documentation: https://github.com/typekit/webfontloader
5
- */
6
-
7
- export async function loadFonts () {
8
- const webFontLoader = await import(/* webpackChunkName: "webfontloader" */'webfontloader')
9
-
10
- webFontLoader.load({
11
- google: {
12
- families: ['Roboto:100,300,400,500,700,900&display=swap'],
13
- },
14
- })
15
- }
@@ -1,15 +0,0 @@
1
- /**
2
- * plugins/webfontloader.js
3
- *
4
- * webfontloader documentation: https://github.com/typekit/webfontloader
5
- */
6
-
7
- export async function loadFonts () {
8
- const webFontLoader = await import(/* webpackChunkName: "webfontloader" */'webfontloader')
9
-
10
- webFontLoader.load({
11
- google: {
12
- families: ['Roboto:100,300,400,500,700,900&display=swap'],
13
- },
14
- })
15
- }
@@ -1,15 +0,0 @@
1
- /**
2
- * plugins/webfontloader.js
3
- *
4
- * webfontloader documentation: https://github.com/typekit/webfontloader
5
- */
6
-
7
- export async function loadFonts () {
8
- const webFontLoader = await import(/* webpackChunkName: "webfontloader" */'webfontloader')
9
-
10
- webFontLoader.load({
11
- google: {
12
- families: ['Roboto:100,300,400,500,700,900&display=swap'],
13
- },
14
- })
15
- }
@@ -1,15 +0,0 @@
1
- /**
2
- * plugins/webfontloader.ts
3
- *
4
- * webfontloader documentation: https://github.com/typekit/webfontloader
5
- */
6
-
7
- export async function loadFonts () {
8
- const webFontLoader = await import(/* webpackChunkName: "webfontloader" */'webfontloader')
9
-
10
- webFontLoader.load({
11
- google: {
12
- families: ['Roboto:100,300,400,500,700,900&display=swap'],
13
- },
14
- })
15
- }
@@ -1,15 +0,0 @@
1
- /**
2
- * plugins/webfontloader.ts
3
- *
4
- * webfontloader documentation: https://github.com/typekit/webfontloader
5
- */
6
-
7
- export async function loadFonts () {
8
- const webFontLoader = await import(/* webpackChunkName: "webfontloader" */'webfontloader')
9
-
10
- webFontLoader.load({
11
- google: {
12
- families: ['Roboto:100,300,400,500,700,900&display=swap'],
13
- },
14
- })
15
- }
@@ -1,15 +0,0 @@
1
- /**
2
- * plugins/webfontloader.ts
3
- *
4
- * webfontloader documentation: https://github.com/typekit/webfontloader
5
- */
6
-
7
- export async function loadFonts () {
8
- const webFontLoader = await import(/* webpackChunkName: "webfontloader" */'webfontloader')
9
-
10
- webFontLoader.load({
11
- google: {
12
- families: ['Roboto:100,300,400,500,700,900&display=swap'],
13
- },
14
- })
15
- }