node.js - 怎么使用webpack vue配合express進(jìn)行開發(fā)
問題描述
我現(xiàn)在通過vue-cli來初始化項(xiàng)目,將后臺相關(guān)的代碼放在 根目錄下的 server文件夾下,并且webpack啟動了8080端口的本地服務(wù)器,server下的express啟動了3000端口的服務(wù)器。目前 我可以通過如下方式前臺發(fā)起get請求獲取到express的response,大概發(fā)起與接收清代如下。
export default { data () { return { a: ’aaaaaaa’ } }, components: { Hello }, created: function () { this.$http.get(’http://localhost:3000/api/test’).then(function (data) { console.log(data) }) }}
var express = require(’express’);var app = express();var api = require(’./routes/api’);// 跨域支持app.all(’*’, (req, res, next) => { const origin = req.headers.origin; res.header(’Access-Control-Allow-Origin’, origin); res.header(’Access-Control-Allow-Headers’, ’Origin, X-Requested-With, Content-Type, Accept, token’); res.header(’Access-Control-Allow-Credentials’, true); res.header(’Access-Control-Allow-Methods’, ’GET, POST, PUT, OPTIONS, DELETE’); next();});app.use(’/api’, api);app.listen(3000);
var express = require(’express’);var router = express.Router();router.get(’/test’, function (req, res, next) { res.send({msg: ’success’});})module.exports = router;
然后這個msg的值 就存在了 response.body下現(xiàn)在我有2種選擇,因?yàn)橄胱鲆粋€社區(qū)做為畢業(yè)設(shè)計(jì),那使用vue-router 還是 express做路由 比較好呢?使用vue-router 就是通過localhost:8080來訪問頁面, 后臺是通過返回json數(shù)據(jù),前臺vue獲取來渲染頁面?使用express的路由, 就是通過localhost:3000來訪問頁面,后臺直接發(fā)送靜態(tài)文件,或者是否可以在ejs模板引擎中使用vue組件呢?
問題解答
回答1:那是因?yàn)関ue-cli已經(jīng)自帶了express,cli本身就是個一站式環(huán)境搭建。你可以看下package.json,里面已經(jīng)有了express
關(guān)于express.Router()的話,之前我也沒用過,去官網(wǎng)看了下。你試試在router.get()代碼后面加上app.use(router)試試。
router.get(’/test’, function (req, res, next) { res.send(’test’);})app.use(router);app.listen(3000);
express.Router()鏈接:http://expressjs.com/zh-cn/4x...
相關(guān)文章:
1. javascript - 這不是對象字面量函數(shù)嗎?為什么要new初始化?2. html5 - 有可以一次性把所有 css外部樣式轉(zhuǎn)為html標(biāo)簽內(nèi)style=" "的方法嗎?3. java - 如何寫一個intellij-idea插件,實(shí)現(xiàn)編譯時修改源代碼的目的4. javascript - 如何將一個div始終固定在某個位置;無論屏幕和分辨率怎么變化;div位置始終不變5. javascript - [js]為什么畫布里不出現(xiàn)圖片呢?在線等6. javascript - vscode alt+shift+f 格式化js代碼,通不過eslint的代碼風(fēng)格檢查怎么辦。。。7. html - vue項(xiàng)目中用到了elementUI問題8. javascript - 有什么比較好的網(wǎng)頁版shell前端組件?9. javascript - 求解答:實(shí)例對象調(diào)用constructor,此時constructor內(nèi)的this的指向?10. javascript - 原生canvas中如何獲取到觸摸事件的canvas內(nèi)坐標(biāo)?
