Vue使用NPM方式搭建項(xiàng)目
一、安裝前說明
環(huán)境依賴： node.js ；
vue官方腳手架 ： vue-cli ；
包管理工具： npm
模塊化打包工具： webpack
安裝 node.js會默認(rèn)安裝npm，vue-cli依賴npm來安裝 。
二、 安裝 node.js
安裝 node.js 可以直接從官網(wǎng)下載安裝，基本是一直點(diǎn)下一步即可。
安裝完成后查看 node 版本： node -v
安裝完成后查看 npm 版本： npm -v
三、創(chuàng)建項(xiàng)目
選擇 webpack作為打包工具，初始化項(xiàng)目，項(xiàng)目名是front-project。安裝過程按照提示填寫相關(guān)配置（默認(rèn)按Enter鍵即可）， 這些配置最終會寫到項(xiàng)目的 package.json 并且安裝相關(guān)模塊。
E:\Tool>vue init webpack front-project
創(chuàng)建好的項(xiàng)目的結(jié)構(gòu)：
項(xiàng)目結(jié)構(gòu)說明可以參考菜鳥教程：
http://www.runoob.com/vue2/vue-directory-structure.html
四、運(yùn)行項(xiàng)目
進(jìn)入到項(xiàng)目里面，然后運(yùn)行命令：
npm run dev
或者進(jìn)入到項(xiàng)目里面，然后運(yùn)行命令（指定端口）：
PORT=8090 npm run dev
總結(jié)
以上所述是小編給大家介紹的Vue使用NPM方式搭建項(xiàng)目，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
這篇文章給大家介紹了vue實(shí)現(xiàn)輪播圖的多種方式,文中給出了四種實(shí)現(xiàn)方式,并通過代碼示例給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作有一定的幫助,感興趣的朋友可以參考下2024-02-02
vue-cli啟動本地服務(wù)局域網(wǎng)不能訪問的原因分析
這篇文章主要介紹了vue-cli啟動本地服務(wù)，局域網(wǎng)下訪問不到的原因分析,在文中還給大家介紹了vue-cli起的webpack項(xiàng)目 用localhost可以訪問，但是切換到ip就不可以訪問 的原因，本文給大家介紹的非常詳細(xì)，需要的朋友參考下2018-01-01
Vite項(xiàng)目中我們可以手動將src路徑設(shè)置**@**路徑別名,可以省下很多引入路徑的冗余路徑,下面這篇文章主要給大家介紹了關(guān)于Vite配置路徑別名的簡單實(shí)現(xiàn)方法,需要的朋友可以參考下2023-04-04
這篇文章主要為大家詳細(xì)介紹了vue.js開發(fā)環(huán)境的安裝教程，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-03-03
這篇文章主要介紹了Vue打印錯(cuò)誤日志問題，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-10-10
詳解Vue用axios發(fā)送post請求自動set cookie
本篇文章主要介紹了Vue用axios發(fā)送post請求自動set cookie，非常具有實(shí)用價(jià)值，需要的朋友可以參考下2017-05-05
Vue3使用ref和reactive管理狀態(tài)的代碼示例
ref 和 reactive 是 Composition API 中用來聲明響應(yīng)式數(shù)據(jù)的兩個(gè)核心函數(shù),在 Vue 3 中,使用 setup 語法糖可以更簡潔地使用這些功能,本文將探討如何使用 ref 和 reactive 來管理狀態(tài),并解釋它們之間的區(qū)別,需要的朋友可以參考下2024-09-09
這篇文章主要為大家詳細(xì)介紹了vue開發(fā)公共組件之返回頂部，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-01-01
vue 導(dǎo)航菜單刷新狀態(tài)不消失,顯示對應(yīng)的路由界面操作
這篇文章主要介紹了vue 導(dǎo)航菜單刷新狀態(tài)不消失,顯示對應(yīng)的路由界面操作，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08
這篇文章主要為大家詳細(xì)介紹了Vue.js下拉菜單組件的使用方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-10-10