typescript 如何在Vue 3中分隔main.ts中的代码？

lb3vh1jj 于 2023-01-27 发布在 TypeScript

关注(0)|答案(1)|浏览(155)

我是Typescript和vue的新手，我很好奇如何从我的主. ts文件中取出这些代码，我只是担心它最终会变得非常难看。

const app = createApp(App);

/* import the fontawesome core */
import { library } from '@fortawesome/fontawesome-svg-core'
/* import font awesome icon component */
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
/* import specific icons */
import { faHammer, faTruckPickup, faSortDown } from '@fortawesome/free-solid-svg-icons'
/* add icons to the library */
library.add(faHammer, faMagnifyingGlass, faSortDown)

app.component('font-awesome-icon', FontAwesomeIcon);

我希望我的主. ts文件看起来像这样（如果有更好的方法可以做到这一点，就不必精确）。

import {addFontAwesomeIcons} from './fontAwesomeLibrary'

const app = createApp(app);

addFontAwesomeIcons(app); //this will use the app object and call library.add() and app.component('font-awesome-icon',FontAwesomeIcon);

这样我的main. ts就不会被我添加的更多图标所污染。
任何帮助都将不胜感激

typescript

来源：https://stackoverflow.com/questions/75252454/how-can-i-separate-code-in-main-ts-in-vue-3

1条答案

按热度按时间

vltsax251#

字体精彩的库插件.ts

import { library } from '@fortawesome/fontawesome-svg-core'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
import { faHammer, faTruckPickup, faSortDown } from '@fortawesome/free-solid-svg-icons'

export const falPlugin = {
  install(app) {
    library.add(faHammer, faMagnifyingGlass, faSortDown)
    app.component('font-awesome-icon', FontAwesomeIcon);
  }
}

主文件.ts

import { falPlugin } from './fontAwesomeLibraryPlugin'
const app = createApp(App);

app.use(falPlugin);
app.mount('#app');

在此记录。

赞(0）回复(0）举报 2023-01-27

我来回答

typescript 如何在Vue 3中分隔main.ts中的代码？

1条答案

相关问题

热门标签

最新问答