ITに頼って生きていく

Vue CLIを使っている場合、node.jsの必要なpackageが変わってくるので、それらを追随させなければいけません。

まず、必要なpackageの追加

yarn add --dev sass@latest
yarn add @nuxtjs/vuetify -D
yarn add sass sass-loader fibers deepmerge -D

次に、導入済みのpackageのupgrade

yarn upgrade vuetify@latest
yarn upgrade vue-cli-plugin-vuetify@latest
yarn upgrade vuetify-loader@latest
yarn upgrade vuex@latest
yarn upgrade babel-polyfill@latest
yarn upgrade vue-router@latest

最後に不要となったpackageの削除

yarn remove stylus
yarn remove stylus-loader

cacheも消しておきましょう。

yarn cache clean
yarn

これでOKです。

grid systemのバグ

2019/12/17現在、Vue2.xにはgrid systemにバグがあります。 いくつかありますが、結構致命的だと思うのが、<v-container>や<v-row>タグに、fill-height 属性を当てられない というバグです。 詳細はこちら。

これでは、画面レイアウト上、謎の空白部分が下のほうにできてしまったりします。

回避策

非推奨ですが、<v-row>の代わりに、1.xで使用されていた<v-layout>を使用することで、意図した動きとするとこができます。