Could not find a declaration file for module 'sweetalert2/dist/sweetalert2.js'

masashi-sutou commented 4 years ago

what's the problem

run cross-env NODE_ENV=development nuxt-ts, I get the following error.

2:41 Could not find a declaration file for module 'sweetalert2/dist/sweetalert2.js'. '~/my_project_name/app/node_modules/sweetalert2/dist/sweetalert2.js' implicitly has an 'any' type.
  Try `npm install @types/sweetalert2` if it exists or add a new declaration (.d.ts) file containing `declare module 'sweetalert2/dist/sweetalert2.js';`
    1 | import Vue from 'vue';
  > 2 | import Swal, { SweetAlertOptions } from 'sweetalert2/dist/sweetalert2.js';
      |                                         ^
    3 | declare type VueSwalInstance = typeof Swal.fire;
    4 | declare module 'vue/types/vue' {
    5 |     interface Vue {

I read README.md and edited nuxt.config.js and tsconfig.json.

//  nuxt.config.js

  modules: [
    'vue-sweetalert2/nuxt',
  ],

//  tsconfig.json

  "types": [
    "vue-sweetalert2"
  ],

related issue: https://github.com/avil13/vue-sweetalert2/issues/61

environment

Version: "vue-sweetalert2": "3.0.5"
Platform: "nuxt": "2.12.2",
- "@nuxt/typescript-runtime": "0.4.8"
- "@nuxt/typescript-build": "1.0.1"

workaround

I downgrade vue-sweetalert2:v2.1.1.

grippado commented 4 years ago

downgrade to v2.1.1 its the only way to solve type problem on nuxt build, in my case!

avil13 commented 4 years ago

Hi. Try this

 import Swal from 'sweetalert2/dist/sweetalert2.js';
 import { SweetAlertOptions } from 'sweetalert2'; //  This is Interface. js files don't store interfaces

grippado commented 4 years ago

Hi. Try this

 import Swal from 'sweetalert2/dist/sweetalert2.js';
 import { SweetAlertOptions } from 'sweetalert2'; //  This is Interface. js files don't store interfaces

@avil13 This solution would be within the specific component/file, where do you want to use SweetAlert2?

avil13 commented 4 years ago

@grippado Excuse me. Hurried up with the answer.

This bug came out of this commit. (https://github.com/avil13/vue-sweetalert2/commit/a2f172880338a002e289f7a9b9266932166948ad), I'll try to fix it now.

avil13 commented 4 years ago

@masashi-sutou fixed in v3.0.6

grippado commented 4 years ago

@avil13 in nuxt, I'm force import css in nuxt.config, this commit resolve this too?

css: [
     'sweetalert2/dist/sweetalert2.css'
],

thx for quick response and interaction <3

avil13 commented 4 years ago

@grippado I will try to install a fresh Nuxt and play it.

grippado commented 4 years ago

@grippado I will try to install a fresh Nuxt and play it.

@avil13 at v3.0.6, and Nuxt v2.13.11, Ill removed import CSS from nuxt.config, and it is fully useful and functionally

avil13 commented 4 years ago

@grippado Actually, it's a problem because there was a issue of how to customize alert themes. And that's exactly what you can do by connecting the styles separately.

I will leave this functionality in this version, but I will have to think about how to solve it better. Thank you for your feedback.

avil13 / vue-sweetalert2