koa和vue專案前後端聯動啟動

2021-09-02 22:59:38 字數 1301 閱讀 4566

最近學習前後端的全棧專案,頭大的要命,慢慢發現,自己越用功想研究一門技術,越發現不懂的慢慢越多,真是有點打擊信心。

好在,今天終於把前後端的基礎框架搭起來了,後續文章分享學習經驗。

今天分享是前後端聯動啟動

首先安裝concurrently

然後安裝vue專案

vue -v  我現在已經裝上3.0版本了。

vue create client 

按照提示把vue-router vuex eslint sass等安裝好,自動安裝依賴包,稍等一會,裝好前端vue專案後,我們啟動一下,8080埠跑起來就ctrl+c退出前端

接下來,修改前端vue的package.json

,

"dependencies": ,

"devdependencies": ,

"eslintconfig": ,

"extends": [

"plugin:vue/essential",

"@vue/standard"

],"rules": {},

"parseroptions":

},"postcss": }},

"browserslist": [

"> 1%",

"last 2 versions",

"not ie <= 8"

]}

注意,主要增加了start命令 npm run serve

接下來,修改後端koa的配置

也是同樣開啟package.json

,

"author": "",

"license": "isc",

"dependencies":

}

注意,也是修改了啟動命令,主要是這三條

"client-install": "npm install --prefix client"  聯動啟動前,先安裝client目錄下的vue專案的npm包

"client": "npm start --prefix client", 聯動啟動前先啟動client目錄下npm start ,看package,json裡,我們已經配置了npm start

"dev": "concurrently \"npm run server\" \"npm run client\""

聯動啟動前後端專案

這樣,我們用concurrently來聯動啟動我們的前後端專案,npm run dev,快樂的啟動吧!

最近腦子感覺不夠用,乙個人默默的啃**,寫下來,防止以後再找資料

日常筆記 vue專案 前後端分離專案跨域問題解決

開發環境 生產環境 後台主導 cors cors 前端主導 proxy nginx module.exports 配置完proxy之後,我們請求介面的位址需要是當前前端服務的位址 既然要請求自己的位址,那麼就沒有必要寫localhost 8080 直接寫 即可 如果使用 那麼就沒有必要使用.env中...

flask和vue前後端分離專案部署

前段時間開發了乙個專案,我後端用的是flask框架寫介面,前端用的是vue框架,專案前後端完全分離,部署的時候遇到一點問題,記錄一下.部署環境 centos6.5 python3.6.3 flask0.12.0 vue 部署方式 uwsgi nginx步驟 1.首先安裝python執行環境,正常 2...

用vue前後端分離專案開發記錄

一 軟體安裝 1.1 檢測node 是否安裝 1.2 安裝 映象 cnpm 1.3 安裝vue cli 1.4 檢查是否安裝vue cli腳手架成功 1.5安裝webpack 模組管理工具 二 建立vue專案 2.1 建立乙個基於webpack專案 2.2 進入專案檔案 2.3以生產環境啟動專案 2...