三分鐘整合vue node多環境框架

2021-09-05 10:15:28 字數 2953 閱讀 3038

vue是國人開發的一款js框架,較angular更為系統,較react更為簡潔,加之webpack的打包、監控、開發環境熱更新等能力,vue的流行不難解釋。

安裝node

vue的執行依賴node環境,如果讀者未安裝請務必先安裝node,非常簡單,只須解壓-新增環境變數,筆者就不再贅述

搭建vue腳手架

筆者的操作環境是windows

整合node(一種最簡單的整合方式)

var http = require('http');					// 引用http元件

var fs = require('fs'); // 引用檔案系統元件

var url = require('url'); // 引用url元件

var events = require('events'); // 引用events元件

const chalk = require('chalk') // 引用color元件

var config = require("../config")

const ora = require('ora') // 引用node載入樣式元件

const rm = require('rimraf') // 引用刪除檔案元件

}response.write(data.tostring()); // 輸出檔案

}response.end(); // 傳送響應資料

});

}).listen(8081);

console.log(chalk.cyan(' node server started. ask: .\n'));

ora('waiting request...').start()

回到vuedemo目錄下,執行以下命令以啟動node服務

c:\users\administrator\desktop\vuedemo>npm run dev && node build/nodeserver.js
接下來可以訪問服務了:

配置多環境

假設我們有4個環境(本地開發環境、聯調環境、測試環境、線上環境)

'use strict'

process.env.type = '"development"'

require('./build')

'use strict'

process.env.type = '"staging"'

require('./build')

'use strict'

module.exports =

"scripts"

:

const ipconfig = ,

staging: ,

production:

}// 本地環境

if (process.env.node_env === 'development') else else if (process.env.type === 'development') else

}

import profile from './profile'

object.defineproperty(vue.prototype, '$profile',)

vue使用說明(以下命令都要在專案根目錄下執行)
c:\users\administrator\desktop\vuedemo>npm install
c:\users\administrator\desktop\vuedemo>npm run dev
c:\users\administrator\desktop\vuedemo>npm run build
c:\users\administrator\desktop\vuedemo>npm run nodeserver-dev
c:\users\administrator\desktop\vuedemo>npm run nodeserver-staging
c:\users\administrator\desktop\vuedemo>npm run nodeserver-prod

沉默三分鐘

網上見此真情之文,藉以自表 原文 http www.hecaitou.net p 3018 沉默三分鐘是心祭。那麼多年了,國旗終於為平民而降。那麼多天了,全民哀悼終於實現。與此同時,火炬停止傳遞,因為這不是乙個歡慶的時刻。很多年後回顧2008年,我 也許寧可它從日曆中消失。還沒有哪一年和今年一樣,才...

《每天感恩三分鐘》

每天感恩三分鐘 有位104歲的老太太耳聰目明,老而彌堅。有人向她請教長壽秘訣,老太太笑了 我有一帖靈丹妙藥,那就是每天化三分鐘時間感恩。她說,化一分鐘感恩父母 丈夫 兒女 鄰居和陌生人 一分鐘感恩大自然給予的種種關懷和體貼 一分鐘感恩每乙個祥和 溫暖和快樂的日子 感恩使她心裡永遠流淌著幸福的泉水,有...

三分鐘讀懂ZeroMQ

zeromq可以分開來看zero mq,mq就是message queue訊息佇列。zero是零,它代表零中介軟體 none broker 零延遲,同時,它又有了新的含義 零管理 零成本 零浪費。總的來說,零表示最小 最簡,這是貫穿於該項目的哲理。致力於減少複雜程度,提高易用性。訊息佇列有四個典型應...