最近專案上有使用到 Sweetalter2 ，可是目前 typescript 的 typing 檔案，只有 Sweetalter 的版本，導致有很多屬性在使用的時候，typescript 看不懂，例如 input 這個屬性。

error_input
  • ts
1
2
3
4
swal({
  title: 'Oops !!!',
  input: 'email' // <- error
});

要解決這個問題呢，我們首先要先知道 swal({}) 是傳入什麼型別，這時候就要找 sweetalert typing 定義檔，就可以看到 swal({}) 傳入的型別是什麼。

sweetalter_typingsweetalter_typing

declare namespace SweetAlert 底下的 interface SettingsBase

型別定義在 namespace SweetAlert 底下的 interface ，知道定義型別的地方後，接下就當然不能直接在這邊新增，因為這是 npm 下載下來的 package。 我們要直接去 typescript 的 typing 新增 SettingsBase 的擴充。

在 Angular 專案底下的 src\typings.d.ts，新增同樣 namespace 與 interface

extend_typingextend_typing

就可以發現，我們使用 swal({}) 就可以傳入 input 屬性了。

successsuccess