how to use it in vue project with Typescript ?

[Hellowor1d]

error just like that : TS7016: Could not find a declaration file for module '@fortawesome/vue-fontawesome'. '/../Workspace/../node_modules/@fo rtawesome/vue-fontawesome/index.js' implicitly has an 'any' type.

---

Having seen the issue"Added typescript definitions" in your another repo, named react-fontawesome, knew that you are hard working on typescript definitions. I felt little ashamed, too poor knowledge about typescript definitions to solve this issue .

Thank you~

[skegel13]

Until the definitions are available, you can include this in your Typescript globals file:

declare module '@fortawesome/*';

[robmadole]

We're actively working on the Typescript defs and should have something out soon.

[lee-alderdice]

By Typescript globals file do you mean vue.d.ts in the node_modules directory or tsconfig.json? Just learning so sorry for such a 101 question.

[ThePlastic]

@skegel13 same problem here, where do I have to put that code? @lee-alderdice did you use it?

[skegel13]

@ThePlastic I put declare module '@fortawesome/*'; in my globals.d.ts file located in the root of my typescript code.

[ThePlastic]

@skegel13 u saved my day, I needed a fast workaround.. Tnx a lot

Looking forward typescript integration

[dannyk08]

Thank you @skegel13, my production build was failing because of these missing types

[VictorioBerra]

@robmadole did you ever get these defs done?

https://github.com/FortAwesome/vue-fontawesome/issues/24#issuecomment-355632502

[VictorioBerra]

You add the new global file to include arrray.

[lee-alderdice]

@ThePlastic I have just sorted this today, did post a comment that @VictorioBerra replied to above about adding it to tsconfig but a lightbulb went off (at last). Added a type.d.ts file with one line it declare module '@fortawesome/*';

Now I can do the same for vue-chartjs! -- progress!

[VictorioBerra]

Does the charts thing require fontawesome? Or does it also not have typings?

On Wed, Jun 27, 2018, 8:25 AM K7Buoy [email protected] wrote:

@ThePlastic https://github.com/ThePlastic I have just sorted this today, did post a comment that @VictorioBerra https://github.com/VictorioBerra replied to above about adding it to tsconfig but a lightbulb went off (at last). Added a type.d.ts file with one line it declare module '@fortawesome/*';

Now I can use vue-chartjs https://github.com/apertureless/vue-chartjs! :-)

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/FortAwesome/vue-fontawesome/issues/24#issuecomment-400670084, or mute the thread https://github.com/notifications/unsubscribe-auth/ACzG6zvw1Ds6j6lJDEs3znLnONBpacGaks5uA4fDgaJpZM4RFbdL .

[lee-alderdice]

It doesn't have typings. They are currently on a pull-request.

---

From: "Victorio Berra" [email protected] Sent: 27 June 2018 14:28 To: "FortAwesome/vue-fontawesome" [email protected] Cc: "K7Buoy" [email protected], "Mention" [email protected] Subject: Re: [FortAwesome/vue-fontawesome] how to use it in vue project withTypescript ? (#24)
Does the charts thing require fontawesome? Or does it also not have typings?

On Wed, Jun 27, 2018, 8:25 AM K7Buoy [email protected] wrote:

@ThePlastic https://github.com/ThePlastic I have just sorted this today, did post a comment that @VictorioBerra https://github.com/VictorioBerra replied to above about adding it to tsconfig but a lightbulb went off (at last). Added a type.d.ts file with one line it declare module '@fortawesome/*';

Now I can use vue-chartjs https://github.com/apertureless/vue-chartjs! :-)

You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/FortAwesome/vue-fontawesome/issues/24#issuecomment-400670084, or mute the thread https://github.com/notifications/unsubscribe-auth/ACzG6zvw1Ds6j6lJDEs3znLnONBpacGaks5uA4fDgaJpZM4RFbdL .

You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

[antoniorib91]

Hi, I'm using typescript version 3.0.0, without types. I had to create a new file inside @fortawesome/vue-fontawesome named index.d.ts with this inside:

file: index.d.ts declare module '@fortawesome/vue-fontawesome';

and inserted in the package.json in @fortawesome/vue-fontawesome this field:

file: package.json "types": "index.d.ts",

after, I had to import in my component.vue file

file: SampleComponent.vue

import { library } from '@fortawesome/fontawesome-svg-core'
import { faCoffee } from '@fortawesome/free-solid-svg-icons'
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
library.add(faCoffee)

@Component({
   name: SampleComponent,
   components: {
        FontAwesomeIcon,
    },
})

and use in my html

<font-awesome-icon icon="coffee"></font-awesome-icon>

I hope it help's someone!

[pheliperocha]

Try to use require instead. Like that:

/* tslint:disable:no-var-requires */
const fontawesome = require('@fortawesome/vue-fontawesome');

And then set the component like that:

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

Works fine with:

• Typescript 3.0.3
• tslint 5.11.0
• vue-fontawesome 0.1.1
• Vue 3.0.1

[luxalpa]

There's currently type definitions shipped with vue-fontawesome, but they don't work with TSX.

[robmadole]

We don’t use TS so any PRs that can fix it for you we will most likely merge.

[jasonlundien]

Closing this issue. Both our Vue 2 and Vue 3 components support TS with our Docs show how to import and add icons.

[nelson6e65]

I'm still not getting error on invalid values or autocomplete for its props in my template while editing:

<fa :icon="['asdasdasd', 'asdasd']"></fa>

Am I missing something?

[nelson6e65]

Never mind, I find out by adding into global components:

// types/vue-core.d.ts

// ...
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';

declare module 'vue' {
  // ..
  interface GlobalComponents {
    fa: typeof FontAwesomeIcon;
  }
}

Inspiration: https://stackoverflow.com/a/70223296/7242535

---

Shouldn't be this in a FAQ or somewhere?

[jasonlundien]

@nelson6e65 ---

I am not fully understanding... what are you thinking should be in a FAQ ?

[nelson6e65]

@jasonlundien The installation of typescript typing for the Vue 3's global component (types/vue-core.d.ts in my example, <fa/>).