koa(nodejs)+webpack+typescript+react hooks+tests

1.package.json

{
  "scripts": {
    "test1": "echo 2",
    "pretest": "echo pretest",
    "client:dev": "scripty",
    "client:prod": "scripty"
  },
}
複製代碼

2.新建目錄: /scripts/client/dev.sh 和 /scripts/client/prod.sh

// /scripts/client/dev.sh :
webpack --mode development

// /scripts/client/prod.sh :
webpack --mode production
複製代碼

3.執行 npm run client:dev 和 npm run client:prod (命令行執行 chmod -R +x scripts/ 把x加個執行權限)

4.webpack.config.js:

// 獲得命令行參數
console.log(process.argv) 
// ['usr/local/bin/node','/User/yuanzhijia/Desktop/yd-system/node_modules/.bin/webpack', '--mode', 'development']
// 首先是node來執行的，
// bin/yd 
#!/usr/local/bin/node

const argv = require('yargs-parser')(process.argv.slice(2))
const _mode = argv.mode || 'development'
const _mergeConfig = require(`./config/webpack.${_mode}.js`)

const merge = require('webpack-merge')
const {join, resolve} from 'path'
module.export = {
    entry: {
        app: join(__dirname, './dist/assets/web/index.tsx')
    }
}
複製代碼

5.web文件夾目錄劃分

|web
    |assets: 靜態資源
    |models: 全部的前端store
    |pages: 負責組裝全部的components
    |components: 能夠聽任何東西
    |routes:前端路由
    |utils:工具方法
    |index.html
|server
    |app.ts 啓動文件
    |controllers 路由
    |service
SPA.MPA融合的項目,server
複製代碼

6.ts工具 json2ts

chmod -x ./bin/yideng

- 前端工程化ssh, linux集羣 
複製代碼

未來能夠作linux的免密登錄 讓遠程的集羣幫你編譯別的模塊
ssh 免密 11.22.33.44.14機器
11.22.33.44.14/d/sh
scp dist文件夾
package 主要負責編譯主模塊 其他的模塊讓package調度遠程機器 仍給集羣編譯， 讓數臺機器幫你編譯，極大提升編譯速度，秒過
如今都是docker集羣化部署
複製代碼

- node核心模式
- webpack的核心原理：loader ast
- fr函數式編程
- tsx: jsx width ts
- bff架構
- 錯誤監控 47:40
複製代碼