vueでUIkitを使う時の注意点

TypescriptでUIkitを使う際には注意が必要。

Typescript用のモジュール@types/uikitは存在するが、依存関係がうまく解決できないっぽくてyarn serve等の開発環境では動作するがビルド時にエラーになることに後々気づいてとても困った。

色々調べたが解決方法はなさそうで、現状素直にjs用のモジュールを使うしかないっぽい。

yarn add --dev uikit
import 'uikit/dist/js/uikit.min.js'
import 'uikit/dist/js/uikit-icons.min.js'
import 'uikit/dist/css/uikit.min.css'

もしくは、vue用のUIkitライクなモジュールVuikitなるものも存在する。

こちらを使うのが確実だが、スライダーなどリッチな一部コンポーネントが搭載されておらず少し不便。