&

<td id="icuc4"></td>

創(chuàng)建一個(gè) Vue 應(yīng)用

當(dāng)前位置：點(diǎn)晴教程→知識(shí)管理交流 →『技術(shù)文檔交流』

freeflydom

2023年6月1日 14:37 本文熱度 1116

創(chuàng)建一個(gè) Vue 應(yīng)用

前提條件

熟悉命令行
已安裝 16.0 或更高版本的 Node.js

在本節(jié)中，我們將介紹如何在本地搭建 Vue 單頁(yè)應(yīng)用。創(chuàng)建的項(xiàng)目將使用基于 Vite 的構(gòu)建設(shè)置，并允許我們使用 Vue 的單文件組件 (SFC)。

確保你安裝了最新版本的 Node.js，并且你的當(dāng)前工作目錄正是打算創(chuàng)建項(xiàng)目的目錄。在命令行中運(yùn)行以下命令 (不要帶上 > 符號(hào))：

> npm init vue@latest

這一指令將會(huì)安裝并執(zhí)行 create-vue，它是 Vue 官方的項(xiàng)目腳手架工具。你將會(huì)看到一些諸如 Typescript 和測(cè)試支持之類的可選功能提示：

? Project name: … <your-project-name>
? Add Typescript? … No / Yes
? Add JSX Support? … No / Yes
? Add Vue Router for Single Page Application development? … No / Yes
? Add Pinia for state management? … No / Yes
? Add Vitest for Unit testing? … No / Yes
? Add an End-to-End Testing Solution? … No / Cypress / Playwright
? Add ESLint for code quality? … No / Yes
? Add Prettier for code formatting? … No / Yes

Scaffolding project in ./<your-project-name>...
Done.

如果不確定是否要開啟某個(gè)功能，你可以直接按下回車鍵選擇 No。在項(xiàng)目被創(chuàng)建后，通過以下步驟安裝依賴并啟動(dòng)開發(fā)服務(wù)器：

> cd <your-project-name>
> npm install
> npm run dev

你現(xiàn)在應(yīng)該已經(jīng)運(yùn)行起來了你的第一個(gè) Vue 項(xiàng)目！請(qǐng)注意，生成的項(xiàng)目中的示例組件使用的是組合式 API 和 <script setup>，而非選項(xiàng)式 API。下面是一些補(bǔ)充提示：

推薦的 IDE 配置是 Visual Studio Code + Volar 擴(kuò)展。如果使用其他編輯器，參考 IDE 支持章節(jié)。
更多工具細(xì)節(jié)，包括與后端框架的整合，我們會(huì)在工具鏈指南進(jìn)行討論。
要了解構(gòu)建工具 Vite 更多背后的細(xì)節(jié)，請(qǐng)查看 Vite 文檔。
如果你選擇使用 Typescript，請(qǐng)閱讀 Typescript 使用指南。

當(dāng)你準(zhǔn)備將應(yīng)用發(fā)布到生產(chǎn)環(huán)境時(shí)，請(qǐng)運(yùn)行：

> npm run build

此命令會(huì)在 ./dist 文件夾中為你的應(yīng)用創(chuàng)建一個(gè)生產(chǎn)環(huán)境的構(gòu)建版本。關(guān)于將應(yīng)用上線生產(chǎn)環(huán)境的更多內(nèi)容，請(qǐng)閱讀生產(chǎn)環(huán)境部署指南。

該文章在 2023/6/1 14:37:09 編輯過

關(guān)鍵字查詢

一個(gè)

應(yīng)用

創(chuàng)建

相關(guān)文章

正在查詢...

點(diǎn)晴ERP是一款針對(duì)中小制造業(yè)的專業(yè)生產(chǎn)管理軟件系統(tǒng),系統(tǒng)成熟度和易用性得到了國(guó)內(nèi)大量中小企業(yè)的青睞。

點(diǎn)晴PMS碼頭管理系統(tǒng)主要針對(duì)港口碼頭集裝箱與散貨日常運(yùn)作、調(diào)度、堆場(chǎng)、車隊(duì)、財(cái)務(wù)費(fèi)用、相關(guān)報(bào)表等業(yè)務(wù)管理，結(jié)合碼頭的業(yè)務(wù)特點(diǎn)，圍繞調(diào)度、堆場(chǎng)作業(yè)而開發(fā)的。集技術(shù)的先進(jìn)性、管理的有效性于一體，是物流碼頭及其他港口類企業(yè)的高效ERP管理信息系統(tǒng)。

點(diǎn)晴WMS倉(cāng)儲(chǔ)管理系統(tǒng)提供了貨物產(chǎn)品管理,銷售管理,采購(gòu)管理,倉(cāng)儲(chǔ)管理,倉(cāng)庫(kù)管理,保質(zhì)期管理,貨位管理,庫(kù)位管理,生產(chǎn)管理,WMS管理系統(tǒng),標(biāo)簽打印,條形碼,二維碼管理,批號(hào)管理軟件。

點(diǎn)晴免費(fèi)OA是一款軟件和通用服務(wù)都免費(fèi)，不限功能、不限時(shí)間、不限用戶的免費(fèi)OA協(xié)同辦公管理系統(tǒng)。

91网首页-91网页版-91网在线观看-91网站免费观看-91网站永久视频-91网站在线播放

創(chuàng)建一個(gè) Vue 應(yīng)用

創(chuàng)建一個(gè) Vue 應(yīng)用