LoginSignup
0
1

More than 5 years have passed since last update.

vue-cli用のテンプレート作ってみた

Posted at

作成背景

  • アイディアからすぐにプロトタイププロジェクトを作成できるようにしたかった
  • 都合のよいパッケージ組み合わせを一発で立ち上げたかった
  • 公式テンプレートの問い合わせ(vue init時の問い合わせ)をカットしたかった

※すべての問い合わせを削除する方法がわからない・・できないのか?

テンプレートベース

前提

$ npm install -g vue-cli

テンプレート1

vue-vuex-pug-bootstrap-stylus.png
https://github.com/yoko0180/vue-vuex-pug-element-stylus

変更点

  • Pug導入
  • Stylus導入
  • Bootstrap導入
  • Vuex導入
  • lint関連削除
  • e2e関連削除
  • unitテスト関連削除
  • build後のfile://~index.htmlでも動作するように変更

起動手順

$ vue init yoko0180/vue-vuex-pug-bootstrap-stylus my-project
$ cd my-project
$ npm install
$ npm run dev

起動画面

vue-vuex-pug-bootstrap-stylus.png

テンプレート2

vue-vuex-pug-element-stylus.png
https://github.com/yoko0180/vue-vuex-pug-element-stylus

変更点

  • テンプレート1のBootstrapをElementUIに置き換え

起動手順

$ vue init yoko0180/vue-vuex-pug-element-stylus my-project
$ cd my-project
$ npm install
$ npm run dev

起動画面

vue-vuex-pug-element-stylus.png

(参考)

おわりに

テンプレート内の条件分岐は可読性が下がるのでできるだけ使いたくないと考えてテンプレート自体を別にしたが考えどころ・・・

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1