ホームページ > 記事 > ウェブフロントエンド > パーセルを使用して vue スキャフォールディングを構成する方法 (詳細なチュートリアル)
parcel-vue は、Parcel パッケージ化ツールに基づく VueJS 高速開発スキャフォールディング ソリューションです。node8.0 以降を使用することを強くお勧めします。この記事では、新しいパッケージング ツールの Parcel Zero-Configuration Vue 開発スキャフォールディングに関する関連知識を紹介します。興味のある方はぜひご覧ください
parcel-vue は、Parcel パッケージング ツールに基づく VueJS 高速開発スキャフォールディング ソリューションです。 0 以降を使用することを強くお勧めします
プロジェクトアドレス: https://github.com/w3c-king/parcel-vue
初期化プロジェクト
$ git clone https://github.com/w3c -king/parcel-vue.git
インストールの依存関係
$ cd parce-vue $ npm install
その中で、vue で終わる単一ファイルの場合は、parcel-plugin-vue を個別に処理する必要があります。 plugin は vueify を通じて対応するコードを生成し、parcel は Parcel-plugin から始まる依存関係を自動的に読み込みます。
開発環境を実行し、ブラウザ http://localhost:1234 を開いてプロジェクトを表示します
$ npm run dev
パッケージ化してコンパイルします
$ npm run build
開発
ディレクトリ構造
src ├── router ├── index.js ├── assets ├── logo.png ├── components ├── Hello ├── index.js ├── index.js ├── views ├── HelloWorld ├── images ├── logo.png ├── HelloWorld.vue ├── styles ├── common.css ├── store ├── global ├── global.js ├── index.js ├── index.js ├── app.vue ├── index.js
を実行するだけですnpm run dev
和 npm run build
開発して構築します。
上記は私があなたのためにまとめたものです。
関連記事:
vue-cli で webpack2 プロジェクトのパッケージ化最適化を実装する方法
es6 のエクスポートとエクスポートのデフォルトの違いは何ですか?
VueでSwiperをカプセル化して画像カルーセルを実装する方法
JSを使用してウォーターフォールフロープラグインを実装する方法
以上がパーセルを使用して vue スキャフォールディングを構成する方法 (詳細なチュートリアル)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。