webstorm+vue初始化項(xiàng)目的方法
vue新項(xiàng)目準(zhǔn)備：
1、安裝nodejs，官網(wǎng)下載傻瓜安裝
node -v 驗(yàn)證
2、npm包管理器，是集成在node中的，所以安裝了node也就有了npm
npm -v 驗(yàn)證
3、安裝cnpm
npm install -g cnpm --registry=http://registry.npm.taobao.org
（完成之后，我們就可以用cnpm代替npm來安裝依賴包了。如果想進(jìn)一步了解cnpm的，查看淘寶npm鏡像官網(wǎng)。）
4、安裝vue-cli腳手架構(gòu)建工具
npm install -g vue-cli
vue新項(xiàng)目構(gòu)建：
1、初始化項(xiàng)目模板：
vue init webpack-simple yunshi-approve
或者
vue init webpack yunshi-approve
2、安裝npm
cd yunshi-approve
3、安裝項(xiàng)目所需要的依賴：
npm install 或 cnpm install
4、運(yùn)行看效果：
npm run dev
介紹一下目錄及其作用：
build：最終發(fā)布的代碼的存放位置。
config：配置路徑、端口號(hào)等一些信息，我們剛開始學(xué)習(xí)的時(shí)候選擇默認(rèn)配置。
node_modules：npm 加載的項(xiàng)目依賴模塊。
src：這里是我們開發(fā)的主要目錄，基本上要做的事情都在這個(gè)目錄里面，里面包含了幾個(gè)目錄及文件：
assets：放置一些圖片，如logo等
components：目錄里放的是一個(gè)組件文件，可以不用。
App.vue：項(xiàng)目入口文件，我們也可以將組件寫這里，而不使用components目錄。
main.js ：項(xiàng)目的核心文件
static：靜態(tài)資源目錄，如圖片、字體等。
test：初始測(cè)試目錄，可刪除
.XXXX文件：配置文件。
index.html：首頁(yè)入口文件，可以添加一些meta信息或者同統(tǒng)計(jì)代碼啥的。
package.json：項(xiàng)目配置文件。
README.md：項(xiàng)目的說明文件。
以上這篇webstorm+vue初始化項(xiàng)目的方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue中使用jeecg進(jìn)行前后端聯(lián)調(diào)方式
這篇文章主要介紹了vue中使用jeecg進(jìn)行前后端聯(lián)調(diào)方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-09-09
這篇文章主要介紹了vue結(jié)合AntV?G2的使用踩坑記錄，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
這篇文章主要介紹了vue去除#問題處理經(jīng)過，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-01-01
vue?圖片路徑?“@/assets“?報(bào)錯(cuò)問題及解決
這篇文章主要介紹了vue?圖片路徑?“@/assets“?報(bào)錯(cuò)問題及解決方案，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-09-09
Mixin混入分發(fā)Vue組件可復(fù)用功能基礎(chǔ)示例
這篇文章主要為大家介紹了Mixin混入分發(fā)Vue組件可復(fù)用功能基礎(chǔ)示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-06-06
vue之字符串、數(shù)組之間的相互轉(zhuǎn)換方式
這篇文章主要介紹了vue之字符串、數(shù)組之間的相互轉(zhuǎn)換方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-07-07
這篇文章主要介紹了vite+vue3中如何使用router問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-06-06
vue?parseHTML?函數(shù)拿到返回值后的處理源碼解析
這篇文章主要為大家介紹了vue?parseHTML?函數(shù)拿到返回值后的處理源碼解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-07-07
Vue中this.$nextTick()方法的使用及代碼示例
$nextTick()是Vue.js框架中的一個(gè)方法，它主要用于DOM操作，當(dāng)我們修改Vue組件中的數(shù)據(jù)時(shí)，Vue.js會(huì)在下次事件循環(huán)前自動(dòng)更新視圖，并異步執(zhí)行$nextTick()中的回調(diào)函數(shù)，本文主要介紹了Vue中this.$nextTick()方法的使用及代碼示例,需要的朋友可以參考下2023-05-05
Vue使用Three.js創(chuàng)建交互式3D場(chǎng)景的全過程
在現(xiàn)代Web開發(fā)中,通過在頁(yè)面中嵌入3D場(chǎng)景,可以為用戶提供更加豐富和交互性的體驗(yàn),Three.js是一款強(qiáng)大的3D JavaScript庫(kù),它簡(jiǎn)化了在瀏覽器中創(chuàng)建復(fù)雜3D場(chǎng)景的過程,本文將介紹如何在Vue中使用Three.js,創(chuàng)建一個(gè)簡(jiǎn)單的交互式3D場(chǎng)景,需要的朋友可以參考下2023-11-11