最終更新:2018-03-29 (木) 16:34:04 (2220d)
Vue Loader
Top / Vue Loader
Vue.js component loader for webpack.
https://github.com/vuejs/vue-loader
vue-loaderとは以下の形式で記述されたVue.js/コンポーネントをプレーンなJavaScript/モジュールに変換するwebpackの loader です。
概要
- vue-loaderはファイルを解析し、それぞれの言語ブロックを必要に応じて他の loader を通し、最終的に module.exports が Vue.js のコンポーネントオプションオブジェクトの CommonJS モジュールに変換します。
.vue
- Vue Component
- HTML のような構文を使用して Vue コンポーネントを記述するカスタムファイルフォーマット
template
- デフォルトの言語は html
- それぞれの *.vue ファイルは最大で一つの <template> ブロックを含みます
- 内容は文字列に展開され、コンパイルされた Vue コンポーネントの template オプションで使用されます
script
- デフォルトの言語は js(babel-loader や buble-loader が検出される場合、自動的にES2015がサポートされる)
- それぞれの *.vue ファイルは最大で一つの <script> ブロックを含みます スクリプトは CommonJS のように処理されます( webpack 経由でバンドルされた通常の .js モジュールと同じです)。つまり他の依存関係を require() することができます。そして ES2015 がサポートされ、import と export 構文を使用することが出来ます
- スクリプトは Vue.js コンポーネントのオプションオブジェクトをエクスポートする必要があります。 Vue.extend() によって拡張されたコンストラクタもエクスポートすることが可能ですが、プレーンなオブジェクトが好ましいです
style
- Sassにも対応