長野エンジニアライフ

東京から長野に移住したエンジニアのブログです。🦒🗻⛰

2020-05-01から1ヶ月間の記事一覧

Options props is deprecated, add sortable options directly as vue.draggable item, or use v-bind.の警告を消したい。

vue

やりたいこと optionsを渡すのは非推奨 対応 やりたいこと 以下の警告を消したい。 Options props is deprecated, add sortable options directly as vue.draggable item, or use v-bind. optionsを渡すのは非推奨 以下のように、propsでoptionsをしているの…

Firestoreに一括で更新を行う

やりたいこと バッチ書き込みを利用 参考 やりたいこと Firestoreにて、複数のドキュメントに対して一括で更新を行いたい。 バッチ書き込みを利用 .batch()で生成したオブジェクトにupdateしたいパスとオブジェクトをガンガン足していく。batch.commit()した…

Vue.Draggableのメモ

vue

Vue.Draggableパッケージをinstall 使用したいコンポーネントで呼び出す (補足) 参考記事 Vue.Draggableパッケージをinstall $ npm install --save vuedraggable 使用したいコンポーネントで呼び出す <template> <div class="board-task-contents" > <draggable> <div v-for="i in 20" :key = "`${i}`" class="task-card"> <h3>番号: {{ i }}</h3> <p>タスク詳細内容</p> </div> </draggable></div></template>

Vueプロジェクトにeslintを導入

vue

[:contens] eslint関連のパッケージをインポート package.jsonに以下を追加 { ... "husky": "^4.2.5", "lint-staged": "^10.2.2", ... "eslint-config-standard": "^14.1.0", "eslint-plugin-import": "^2.18.2", "eslint-plugin-node": "^10.0.0", "eslint-…

vue-routerの追加実装

vue

vue-routerの追加 rouoter用のindex.jsを作成 main.jsにrouterを追記 App.vueで<router-view>に書き換え 参考記事 vue-routerの追加 $ npm install --save-dev vue-router rouoter用のindex.jsを作成 src/router配下にindex.jsを作成 import Vue from 'vue'; import VueRo</router-view>…

VuetifyとPWAで色々やったときの備忘録

Vueプロジェクトの作成 Vuetify、PWAの準備 manifest.jsonの追加 firebaseにデプロイ 動作確認 とりあえず Vueプロジェクトの作成 $ vue create the-simplist Vuetify、PWAの準備 $ vue add vuetify $ vue add pwa manifest.jsonの追加 /publics配下にmanife…

ERROR Error: spawn yarn ENOENTの対応

事象 対応方針 参考記事 vue createしたら発生 事象 ERROR Error: spawn yarn ENOENT Error: spawn yarn ENOENT at Process.ChildProcess._handle.onexit (internal/child_process.js:232:19) at onErrorNT (internal/child_process.js:407:16) at process._…

VueプロジェクトのPWA化作業

VueCLIの用意 既存のVueプロジェクトをPWA化 manifest.jsonの作成 参考記事 VueCLIの用意 VueCLIが用意できていなかったので npm install -g @vue/cli 既存のVueプロジェクトをPWA化 vue add @vue/pwawを実行 -> % vue add @vue/pwa Installing @vue/cli-pl…

Error: Cannot find module 'sass' の対応

vue

事象 対応 事象 internal/modules/cjs/loader.js:583 throw err; ^ Error: Cannot find module 'sass' at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15) at Function.Module._load (internal/modules/cjs/loader.js:507:25) at…

Vue.jsプロジェクトにて、e2eテストが失敗する

事象 原因 対応 事象 > node test/e2e/runner.js Starting selenium server... started - PID: 40935 [Login] Test Suite ====================== Running: ログイン { parser: "babylon" } is deprecated; we now treat it as { parser: "babel" }. Error r…