快速原型開發(fā)

你可以使用 vue serve和 vue build 命令對(duì)單個(gè) *.vue 文件進(jìn)行快速原型開發(fā)，不過這需要先額外安裝一個(gè)全局的擴(kuò)展：

npm install -g @vue/cli-service-global

vue serve的缺點(diǎn)就是它需要安裝全局依賴，這使得它在不同機(jī)器上的一致性不能得到保證。因此這只適用于快速原型開發(fā)。

vue serve

Usage: serve [options] [entry]

在開發(fā)環(huán)境模式下零配置為 .js 或 .vue 文件啟動(dòng)一個(gè)服務(wù)器


Options:

  -o, --open  打開瀏覽器
  -c, --copy  將本地 URL 復(fù)制到剪切板
  -h, --help  輸出用法信息

你所需要的僅僅是一個(gè) App.vue文件：

<template>
  <h1>Hello vue!</h1>
</template>

然后在這個(gè) App.vue 文件所在的目錄下運(yùn)行：

vue serve

vue serve 使用了和 vue create 創(chuàng)建的項(xiàng)目相同的默認(rèn)設(shè)置 (webpack、Babel、PostCSS 和 ESLint)。它會(huì)在當(dāng)前目錄自動(dòng)推導(dǎo)入口文件——入口可以是 main.js、index.js、App.vue 或 app.vue中的一個(gè)。你也可以顯式地指定入口文件：

vue serve app.vue

如果需要，你還可以提供一個(gè)index.html、package.json、安裝并使用本地依賴、甚至通過相應(yīng)的配置文件配置 Babel、PostCSS 和 ESLint。

vue build

在生產(chǎn)環(huán)境模式下零配置構(gòu)建一個(gè) .js 或 .vue 文件


Options:

  -t, --target <target>  構(gòu)建目標(biāo) (app | lib | wc | wc-async, 默認(rèn)值：app)
  -n, --name <name>      庫的名字或 Web Components 組件的名字 (默認(rèn)值：入口文件名)
  -d, --dest <dir>       輸出目錄 (默認(rèn)值：dist)
  -h, --help             輸出用法信息

你也可以使用 vue build 將目標(biāo)文件構(gòu)建成一個(gè)生產(chǎn)環(huán)境的包并用來部署：

vue build app.vue

vue build 也提供了將組件構(gòu)建成為一個(gè)庫或一個(gè) Web Components 組件的能力。查閱構(gòu)建目標(biāo)了解更多