javascript-你如何在 nuxt 3 上设置好字体
发布时间:2022-06-25 15:30:12 399
相关标签: # 前端
当我尝试在我的nuxt 3应用程序中呈现这个字体很棒的组件时,我遇到了以下错误,遵循了所有npm的正确安装,并且无法在应用程序中获得没有任何错误的图标。
at WeakMap.set ()
at normalizePropsOptions (./node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:3966:11)
at createComponentInstance (./node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:6957:23)
at renderComponentVNode (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:171:22)
at Module.ssrRenderComponent (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:608:12)
at _sfc_ssrRender (./.nuxt/dist/server/server.mjs:2939:33)
at renderComponentSubTree (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:253:13)
at renderComponentVNode (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:188:16)
at Module.ssrRenderComponent (./node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:608:12)
at _sfc_ssrRender (./.nuxt/dist/server/server.mjs:9374:31)
这是破坏应用程序的代码行
<font-awesome-icon :icon="['fas', 'user']" />
nuxt.config file
import { defineNuxtConfig } from "nuxt";
export default defineNuxtConfig({
css: ["@/assets/css/tailwind.css"],
build: {
postcss: {
postcssOptions: {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
},
},
},
plugins: ["~/plugins/fontawesome.js"],
buildModules: [
["@pinia/nuxt", { disableVuex: true }],
["@nuxtjs/tailwindcss", { config: "@/tailwind.config.js" }],
],
modules: ["@nuxtjs/tailwindcss"],
});
plugin file
import { library } from "@fortawesome/fontawesome-svg-core";
import { fas } from "@fortawesome/free-solid-svg-icons";
// import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
export default defineNuxtPlugin((nuxtApp) => {
// nuxtApp.vueApp.component("FontAwesomeIcon", FontAwesomeIcon);
library.add(fas);
});
我之所以使用这个插件,是因为无论出于什么原因,设置npm@nuxt/fortawesome都不起作用
package.json
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^6.1.1",
"@fortawesome/free-brands-svg-icons": "^6.1.1",
"@fortawesome/free-solid-svg-icons": "^6.1.1",
"@fortawesome/vue-fontawesome": "^2.0.8",
"@supabase/supabase-js": "^1.35.3",
"pinia": "^2.0.14"
}
}
特别声明:以上内容(图片及文字)均为互联网收集或者用户上传发布,本站仅提供信息存储服务!如有侵权或有涉及法律问题请联系我们。
举报