wip

TODO.md

@@ -0,0 +1,14 @@
+## Providers
+- [ ] google
+- [ ] bunny
+- [ ] fontshare
+- [ ] font-source?
+- [ ] custom
+- [ ] (public)
+
+## Features
+
+- zero-configuration required
+- automatic font metric optimisation powered by https://github.com/unjs/fontaine
+- built-in providers (`google`, `bunny`, `local` and more)
+- custom providers for full control

build.config.ts

@@ -0,0 +1,4 @@
+import { defineBuildConfig } from 'unbuild'
+export default defineBuildConfig({
+ externals: ['css-tree', '#types']
+})

package.json

@@ -21,7 +21,7 @@
  "prepack": "nuxt-module-build",
  "dev": "nuxi dev playground",
  "dev:build": "nuxi build playground",
- "dev:prepare": "nuxt-module-build --stub && nuxt-module-build prepare && nuxi prepare playground",
+ "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
  "release": "npm run lint && npm run test && npm run prepack && changelogen --release && npm publish && git push --follow-tags",
  "lint": "eslint .",
  "test": "vitest run",
@@ -30,18 +30,27 @@
  },
  "dependencies": {
  "@nuxt/kit": "^3.10.2",
- "fontaine": "^0.4.1"
+ "csstree": "^0.0.3",
+ "defu": "^6.1.4",
+ "fontaine": "^0.4.1",
+ "globby": "^14.0.1",
+ "magic-string": "^0.30.7",
+ "pathe": "^1.1.2",
+ "ufo": "^1.4.0",
+ "unplugin": "^1.7.1"
  },
  "devDependencies": {
  "@nuxt/devtools": "latest",
  "@nuxt/eslint-config": "^0.2.0",
  "@nuxt/module-builder": "^0.5.5",
  "@nuxt/schema": "^3.10.2",
  "@nuxt/test-utils": "^3.11.0",
+ "@types/css-tree": "^2.3.6",
  "@vitest/coverage-v8": "^1.3.0",
  "changelogen": "^0.5.5",
  "eslint": "^8.56.0",
  "typescript": "^5.3.3",
+ "unbuild": "^2.0.0",
  "vitest": "^1.3.0",
  "vue-tsc": "^1.8.27"
  },

playground/app.vue

@@ -3,3 +3,12 @@
  Nuxt module playground!
  </div>
 </template>
+
+<style scoped>
+@import '~/assets/test.css';
+
+div {
+ color: red;
+ font-family: 'Roboto', Courier, monospace;
+}
+</style>

playground/assets/test.css

@@ -0,0 +1,3 @@
+:root {
+ font-family: 'Roboto', sans-serif;
+}

playground/nuxt.config.ts

@@ -1,5 +1,29 @@
 export default defineNuxtConfig({
  devtools: { enabled: true },
- modules: ['@nuxt/fonts'],
- fonts: {},
+ modules: [
+ '@nuxt/fonts',
+ // '@nuxtjs/tailwindcss'
+ ],
+ fonts: {
+ providers: {
+ google: false
+ }
+ // provider: 'google', // sets default provider
+ // families: [
+ // {
+ // name: 'Roboto', // the 'canonical' name of the font used to look it up in a provider database
+ // as: 'custom-roboto-family', // allow registering a font family with a different name
+ // provider: 'local', // you can override the provider on a per-family basis
+ // // provider specific options can be provided
+ // src: '~/public/roboto.woff2', // you can specify a source within your project
+ // // specific configuration will be used to generate `@font-face` definitions
+ // subsets: ['latin', 'greek'],
+ // display: 'swap', // or 'block'7
+ // weight: ['400', '700'],
+ // style: ['normal', 'italic'],
+ // // and produce CSS overrides to reduce layout shift (using fontaine)
+ // fallbacks: ['Arial'],
+ // }
+ // ]
+ }
 })

playground/package.json

@@ -9,6 +9,7 @@
  },
  "dependencies": {
  "@nuxt/fonts": "latest",
+ "@nuxtjs/tailwindcss": "latest",
  "nuxt": "latest",
  "vue": "latest"
  }