はじめに
これまでの連載で,
これまでの連載ではVue.
vue-cliによるアプリケーション開発
前準備
開発にnpm
vue-cli
vue-cliとは,
JavaScriptでアプリケーションを構築する場合,
vue-cliのインストール
では,
$ npm install -g vue-cli
インストールが完了したら,
$ vue --version 2.6.0
本稿では執筆時点での最新バージョンである2.
アプリケーションプロジェクトの作成
vue-cliのインストールが完了したら,
$ vue init webpack vue-cli-gihyo-example
上記コマンドを実行すると,
This will install Vue 2.x version of template. For Vue 1.x use: vue init webpack#1.0 vue-cli-gihyo-example ? Project name vue-cli-gihyo-example ? Project description A Vue.js project ? Author kazuya kawaguchi <xxx@domain.com> ? Vue build standalone ? Use ESLint to lint your code? Yes ? Pick an ESLint preset Standard ? Setup unit tests with Karma + Mocha? Yes ? Setup e2e tests with Nightwatch? Yes
入力が完了すると下記の内容が出力され,
vue-cli · Generated "vue-cli-gihyo-example". To get started: cd vue-cli-gihyo-example npm install npm run dev Documentation can be found at https://vuejs-templates.github.io/webpack
出力されたメッセージには,
アプリケーションの開発を開始する
Vue.
$ cd vue-cli-gihyo-example $ npm install $ npm run dev
npm install
でVue.
次にnpm run dev
で動作確認のための開発用サーバが起動すると,
最小限に動作するアプリケーションの雛形となるコードが生成されています。以降は,