はてなブックマーク

webpackでビルドされるファイルを管理する上で、 出力先のディレクトリを一旦キレイにしてからビルドする方法を学んだので備忘録。 結論、rimrafをnpmでインストールしてUNIXコマンド rm -rfを使えるようにします。 導入 npmもしくはyarnでパッケージをインストールします。

webpackとは フロントエンド開発におけるオープンソースのモジュールバンドラーである。 ここで言うモジュールとは、JavascriptやCSS、画像などのファイルを示し、モジュールバンドラーとはこれらのファイルをまとめる役割を持つ。現在の最新はバージョン5となっている。 webpackを利用するメリット ・自動でファイルの依存関係を解決してくれる ・リソースをコンパクトにしてくれる ・ローダーや各種プラグインを導入する事でデフォルトの設定を上書きし、機能を拡張する事が出来る 導入方法 ①Node.jsをインストールする webpackはNode.jsで動かす為、最初にインストールしておく。 ②フロントエンドパッケージを初期化 Node.js上で動かすモジュールの管理には今回npmを使用する。

vueに慣れている人であれば当たり前の話だと思いますが、 結構ググっているとkeyにindexを使っての解説を目にする事があったので、 何番煎じか分かりませんが、自身のアウトプットの為に備忘録していきます。 ※vue.jsをこれから学んで行く人向けです。 v-forディレクティブとは vueで配列に基づいて、リストレンダリングする為に使用するディレクティブです。 所謂for文としての使い方をします。単数形 in 複数形 のような構文を用います。 複数形の部分がソースの配列で、単数形の部分は配列要素が反復されているエイリアスなので、変数のように設定が可能になっています。別に単数形でなくても動きます。

フロント開発をする中、head要素をvueで管理する方法として、 vue-headというライブラリを導入する機会があったので、備忘録としてまとめておく。 前提 vue-routerを導入している事。 ※この記事ではvue-routerについての解説は行いません。 手順 導入自体はとても簡単。 まずはnpmコマンドでパッケージをインストール。