vue crane

vue-crane（未維護）

通用、模組化、多頁、全端 Vue 樣板，可處理大型專案。基於 Node.js、Express、PM2、Lerna、Webpack、Babel、Vue.js、Element、PostCSS。

特徵

• element-ui作為 UI 實用程式。
• 使用lint-staged將prettier和ESlint結合在預提交鉤子中。不用擔心垃圾程式碼會溜進你的程式碼庫。
• pm2作為生產流程管理者。
• http-proxy-middleware用於遠端伺服器 api 代理以避免 CORS 錯誤。
• 使用webpack dll來提高建置時效能。
• 支援透過cli dynamic webpack entry 。
• lerna用於管理一個專案中的多個專案。
• postcss用於下一代 CSS 預處理器。
• 將開發和生產伺服器合併到一台express伺服器。
• winston作為記錄器系統。
• 支援快速路由器自訂。
• 自動產生bundle專案進行部署。

入門

git clone https://github.com/posrix/vue-crane my-project
cd my-project
npm install
npm run dev

動態Webpack入口

在一個大型專案的開發生命週期中。讓 webpack 建立必要的文件比建立整個專案要體面得多。 vue-crane使用cli作為入口讓使用者選擇開發哪個模組。

伺服器端開發

使用nodemon啟動具有熱重載功能的本機生產伺服器。

$ npm install
$ npm run build
$ npm run local 

生產

vue-crane中有3生產環境：

• Test環境
• Pre-Release環境
• Release環境

每個環境都有自己的啟動腳本：

測試環境：

$ npm run stage

預發布環境：

$ npm run pre

發布環境：

$ npm run release

部署

vue-crane 使用名為 vue-crane-bundle 的捆綁項目進行部署。每次您想要迭代新版本時，只需執行一個 shell 腳本即可。所有的東西都將在您的捆綁項目中解決。使用bundle專案進行部署有三個好處：

• 保持不同環境下伺服器依賴關係的一致性。
• 發生錯誤時快速回滾到先前的版本。
• 僅將必要的文件部署到線上生產伺服器上。

部署步驟

1. 建立一個空的 git 儲存庫作為您的捆綁項目。將遠端 url 新增至任何 git 儲存庫託管服務。確保您的捆綁項目與來源項目位於相同資料夾層級。

2. 編輯package.json中的捆綁腳本。需提供三個參數： source_project 、 bundle_project 、 release_branch 。

{
  "bundle" : " sh ./tasks/bundle.sh source_project bundle_project release_branch "
}

3. 執行捆綁腳本。

$ npm run bundle

執照

麻省理工學院許可證 (MIT)。請參閱許可證文件以獲取更多資訊。