vue boilerplate template
vue-boilerplate-template V2.0.0
中規模 (+) VUEプロジェクトを構築する方法については、過去の経験に基づいた参考情報を提供します。 vue-cli3をベースにした最新の Vue ボイラープレートがオープン ソースになりました:weasome-vue-cli3-example。これに注目すれば、非常に価値があると思います。
Node.js (>=4.x、8.x を推奨)、Npm バージョン 4 以降 (Yarn を推奨)、Git。
オンラインデモページ
vue-cliビルドをベースに、 vue を使いやすくするための最適化を行います。vue-i18n 、 axios 、 lodashなど、一般的に使用されるライブラリがすでに多数含まれています。Vueに関するいくつかの体験記事 (例: どう写一手漂亮的 Vue)。そして今も更新され続けています。WebPack使用してアプリケーションを構築する方法をさらに最適化します。 git clone https://github.com/nicejade/vue-boilerplate-template (your-project-name)
cd your-project-name
npm install (npm i / yarn)
npm start / npm run dev / yarn run dev
http://localhost:8080/ に移動します。ポート 8080 がマシン上ですでに使用されている場合、プログラムは使用可能なポート (増分) を指定します (例: 8081 / 8082 ...) 。もちろん、次のコマンドを使用してポートを一時的に置き換えることもできます。
PORT=8888 npm run dev
補足：PORTが自分のマシン上で実行できるコマンドであることを確認する必要があります。
npm run build
同等の実行node build.js 、ビルド プロジェクトを開始します。
npm run build:dll
同等の実行webpack --config build/webpack.dll.conf.js 。詳細については、「webpack.DllPlugin」を参照してください。
npm run jarvis / yarn run jarvis
webpack-jarvis (非常にインテリジェントなブラウザベースの Webpack ダッシュボード) を実行します。ブラウザで localhost:1337 を開くと、それが表示されます。
npm run pretestnodejs を使用してローカル サーバー http://localhost:3000/ を構築し、パッケージの後にコードの簡単な事前テストを実行します。
npm run analyz
Webpack プラグインおよび CLI ユーティリティは、バンドル コンテンツを便利なインタラクティブなズーム可能なツリーマップとして表現します。このアドレス：http://localhost:8888/ が自動的に開きます。
バックエンドは次の形式のデータを返すことができ、それがより良いです。
{
success: true,
message: 'err message content',
value: [
// Useful data
]
}
フロントエンドでは、次のようにリクエストを処理できます。
let params = {
// Interface required parameters
}
this.isLoading = true
this.$apis.moduleName.getProfile(params).then(result => {
// Handle the correct data you received
}).catch(error => {
this.$message.error(`Error: ${error}`)
}).fin(() => {
this.isLoading = false
})
非常に配慮して、Template はリクエストを均一に処理できるように支援されているため、非常に使いやすくなっています。もちろん、必要に応じてhelper/ajax.jsファイルで独自の内容を変更することもできます。
定型テンプレートの例を参照してください。または、適用された例、オンライン アドレス: https://nicelinks.site。
マサチューセッツ工科大学
著作権 (c) 2017 年現在、nicejade。
