1.package.jsonhtml
{
"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加个执行权限)node
4.webpack.config.js:
linux
// 获得命令行参数
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文件夹目录划分webpack
|web
|assets: 静态资源
|models: 全部的前端store
|pages: 负责组装全部的components
|components: 能够听任何东西
|routes:前端路由
|utils:工具方法
|index.html
|server
|app.ts 启动文件
|controllers 路由
|service
SPA.MPA融合的项目,server
复制代码
6.ts工具 json2ts
web
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
复制代码