开源中国 2018 年度最后一场技术盛会邀你来约~错过就要等明年啦!点此立即预约

大漠穷秋 / OpenWMS-FrontendTypeScriptMIT

Watch 131 Star 158 Fork 111
加入码云
与超过 300 万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
这是OpenWMS项目的前端代码,基于Angular 7.0.0 和PrimeNG 6.1.5。 展开 收起

http://www.ngfans.net

Loading...
README-cn.md

README in English

OpenWMS-Frontend

这是 OpenWMS 项目的前端代码,特性如下:

  • Angular核心包:7.0.0
  • 组件库:PrimeNG 6.1.5
  • 图表:ngx-echarts
  • 国际化:ngx-translate
  • 字体图标:font-awesome

所有东西都已经整合好。

演示地址

在阿里云上的演示地址 http://47.104.80.251:4200

效果截图

目录结构

演进历史

用法

请先fork本项目
git clone 你自己fork之后的项目路径
cd OpenWMS-Frontend
npm i -g cnpm --registry=https://registry.npm.taobao.org
cnpm i -g @angular/cli
cnpm install
ng serve -e dev

打开你的浏览器,访问http://localhost:4200/

切换不同的运行环境

在 src/environments 目录下提供了 3 份配置文件,分别对应 dev、mock 和 prod 环境。

ng serve 默认使用 dev 这份配置文件,如果需要切换到 mock 环境,请运行:

ng serve -e mock

HMR 支持

在开发状态,你可能不想每次修改代码之后都让浏览器全部刷新,你希望能“热替换”,所以有了 HRM 这个机制。

@angular/cli 在默认情况下不支持 HMR,所以这里我们手动进行了支持,具体做法请参考这里:https://medium.com/wizardnet972/hot-module-replacement-with-angular-cli-5fc7a3ae4a9c

以 HRM 的方式启动此项目请执行:

npm run hmr

特别注意:最新的@angular/cli 6.x 版本已经内置了 HMR 支持,只要执行以下命令即可:

ng serve --hmr

打包体积分析

以下是项目 build 出来的体积:

用 webpack-bundle-analyzer 分析之后可以看到各个模块在编译之后所占的体积:

可以看到,主要是因为 ECharts 和 PrimeNG 占的体积比较大,建议您在使用的时候做一下异步,用不到的组件不要一股脑全部导入进来。

开源许可证

MIT

你可以随意使用此项目,无需通知我,因为我可能很忙没空搭理你。

如果你需要更多中文版学习资料,请看这里:www.ngfans.net

此项目专用 QQ 交流群

Angular-OpenWMS

如果你觉得这个项目对你有用,请给它加个星

项目点评 ( 12 )

你可以在登录后,发表评论

搜索帮助

12_float_left_people 12_float_left_close