Vue.jsのコンポーネントのimport文をdynamic importに変換するCLIコマンドを作りました

3976 ワード
Vue.js nuxt.js Node.js npm Node.js テキストリンク

Vue.jsのコンポーネントのimportをdynamic importに変換するCLIコマンドを作りました。
その名も「dynamic-import-converter」
特定のディレクトリ配下のvueファイルを全てdynamic importに変換します。

ソースはこちらで公開しています。
https://github.com/harhogefoo/dynamic-import-converter

通常のcomponentのimport文
<template>
  <div>
    <hoge />
    <piyo />
  </div>
</template>

<script>
import Hoge from "@/components/Hoge.vue"
import Piyo from "@/components/Piyo.vue"

export default {
  components: {
    Hoge,
    Piyo
  }
}
</script>
dynamic_importに変換
<template>
  <div>
    <hoge />
    <piyo />
  </div>
</template>

<script>

export default {
  components: {
    Hoge: () => import("@/components/Hoge.vue"),
    Piyo: () => import("@/components/Piyo.vue")
  }
}
</script>

使い方

$ yarn global add dynamic-import-converter
or
$ npm install -g dynamic-import-converter

$ dynamic-import-converter ./Vueファイルが格納されたディレクトリのパス/

バグ、改善要望などは、リポジトリのissueまで！
https://github.com/harhogefoo/dynamic-import-converter/issues

Tomcat 5[1].0.19中国語の文字化けしを徹底的に解決する
servletコンテナとwebコンテナの概念