? 阿里云前端工程化工具 Dawn 正式开源!

简介: ![Banner](https://github.com/alibaba/dawn/raw/master/docs/assets/banner.png) # Dawn Dawn 取「黎明、破晓」之意,原为「阿里云·业务运营团队」内部的前端构建和工程化工具,现已完全开源。它通过 pipeline 和 middleware 将开发过程抽象为相对固定的阶段和有限的操作,简化并统一了开发人员的

Banner

Dawn

Dawn 取「黎明、破晓」之意,原为「阿里云·业务运营团队」内部的前端构建和工程化工具,现已完全开源。它通过 pipeline 和 middleware 将开发过程抽象为相对固定的阶段和有限的操作,简化并统一了开发人员的日常构建与开发相关的工作。

npm NPM Version Build Status Coverage Status npm

项目地址:https://github.com/alibaba/dawn (感兴趣请赏个 Star)

特点

  • 采用中间件技术,封装常用功能,易于扩展,方便重用
  • 支持 pipeline 让多个 task 协同完成构建任务
  • 简单、一致的命令行接口,易于开发人员使用
  • 根据模板快速生成项目工程结构
  • 支持基于「中心服务」管理中件间和工程模板
  • 支持搭建私有中心服务,并统一下发构建规则,易于团队统一管理

安装

$ npm install dawn -g

使用

# 1. 创建 & 初始化
$ dn init -t front

# 2. 开发 & 实时编译
$ dn dev

# 3. 语法检查 & 测试
$ dn test

# 4. 构建 & 打包
$ dn build

示例(.dawn.yml 或 .dawn 目录)

# 启动开发服务
dev:
  - name: webpack
    entry: ./src/*.js
    template: ./assets/*.html
    watch: true
  - name: server
    port: 8001
    
# 直接构建
buid:
  - name: webpack
    entry: ./src/*.js
    template: ./assets/*.html

文档

-- end --

目录
相关文章
|
4月前
|
运维 前端开发 JavaScript
前端埋点校验工具:数据驱动的最后一道防线
数据埋点是企业决策的关键基础,但常面临覆盖率低、数据不准和故障难排查三大难题。本文深入剖析了这些问题的成因与影响,并提出“三维校验矩阵”解决方案:提升覆盖率至99.8%、降低错误率至0.3%、提速故障定位5倍。同时对比Split.io、Tealium、Sentry、板栗看板等工具优劣,为企业选型提供参考。迈向高质量数据治理,从精准埋点开始。
|
4月前
|
JSON 前端开发 JavaScript
惊艳!阿里开源 15.2k Star 企业级低代码引擎揭秘,如何变革前端开发方式?
阿里巴巴开源的 LowCodeEngine 是一款企业级低代码引擎,具备可视化编排、UI 渲染、代码生成等全链路能力。支持 React、Vue、Rax 等框架,提供高扩展性与类型安全,助力高效开发,降低维护成本,适用于后台系统、多端同步等场景。
831 1
|
3月前
|
JSON 监控 前端开发
AMIS:百度开源的前端低代码神器,18.4k star 背后的开发效率提升利器
AMIS(前端低代码框架)是百度开源的低代码前端框架,基于纯 JSON 配置即可生成完整后台页面,包括表单、表格、图表、CRUD 列表,支持可视化拖拽编辑。,星标数已达 18.4k,百度内部已沉淀超过 5 万个页面,广泛应用于审核系统、数据管理后台、模型监控等落地场景
738 0
|
7月前
|
人工智能 自然语言处理 前端开发
DeepSite:基于DeepSeek的开源AI前端开发神器,一键生成游戏/网页代码
DeepSite是基于DeepSeek-V3模型的在线开发工具,无需配置环境即可通过自然语言描述快速生成游戏、网页和应用代码,并支持实时预览效果,显著降低开发门槛。
1422 93
DeepSite:基于DeepSeek的开源AI前端开发神器,一键生成游戏/网页代码
|
4月前
|
Web App开发 前端开发 关系型数据库
GitHub 2.8k star 开源既封神,“Liquid‑Glass‑React”,让你前端界面瞬间拥有苹果级液态玻璃效果!
Liquid-Glass-React 是一款开源前端组件,旨在将 Apple iOS 26 的“液态玻璃”视觉效果引入 React 应用。凭借逼真折射、多种反射模式、响应式交互及高度可配置性,它已获得 2.8k stars,成为提升 UI 质感的热门工具。
436 0
|
5月前
|
人工智能 前端开发 数据可视化
天都塌了,17K+ Star 的AI开源神器!Onlook 如何颠覆前端开发与设计协作?怎么办
Onlook是一款开源的视觉优先代码编辑器,结合Figma直观操作与VS Code强大功能,支持浏览器中实时构建、编辑和部署React应用。项目已获17K+Star,提供快速创建Next.js应用、所见即所得的可视化编辑、AI驱动开发工具及一键部署协作等功能,是前端开发与设计协作的理想选择。
891 0
|
10月前
|
机器学习/深度学习 人工智能 自然语言处理
DeepSeek Artifacts:在线实时预览的前端 AI 编程工具,基于DeepSeek V3快速生成React App
DeepSeek Artifacts是Hugging Face推出的免费AI编程工具,基于DeepSeek V3,支持快速生成React和Tailwind CSS代码,适合快速原型开发和前端组件构建。
2246 39
DeepSeek Artifacts:在线实时预览的前端 AI 编程工具,基于DeepSeek V3快速生成React App
|
9月前
|
安全 前端开发 开发工具
【01】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-项目开发实战-优雅草卓伊凡拟开发一个一站式家政服务平台-前期筹备-暂定取名斑马家政软件系统-本项目前端开源-服务端采用优雅草蜻蜓Z系统-搭配ruoyi框架admin后台-全过程实战项目分享-从零开发到上线
【01】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-项目开发实战-优雅草卓伊凡拟开发一个一站式家政服务平台-前期筹备-暂定取名斑马家政软件系统-本项目前端开源-服务端采用优雅草蜻蜓Z系统-搭配ruoyi框架admin后台-全过程实战项目分享-从零开发到上线
465 5
【01】鸿蒙实战应用开发-华为鸿蒙纯血操作系统Harmony OS NEXT-项目开发实战-优雅草卓伊凡拟开发一个一站式家政服务平台-前期筹备-暂定取名斑马家政软件系统-本项目前端开源-服务端采用优雅草蜻蜓Z系统-搭配ruoyi框架admin后台-全过程实战项目分享-从零开发到上线
|
8月前
|
JSON 人工智能 前端开发
前端开发中使用whistle代理工具
Whistle是一款强大的代理工具,相比Charles、Fiddler更轻量且功能丰富。它适用于前端开发中的多种场景,如接口数据Mock、接口代理、静态资源代理等。通过简单的规则配置,可将接口指向本地JSON文件,解决跨域问题,或代理静态资源以满足特定域名访问需求。此外,Whistle还支持本地端口间转发与移动端请求抓包,搭配SwitchyOmega插件使用效果更佳。需注意,使用前请确保已安装Node环境并参考官方文档完成基础配置。
|
11月前
|
人工智能 前端开发 小程序
2024年12月30日蜻蜓蜻蜓AI工具系统v1.0.0发布-优雅草科技本产品前端源代码已对外开源可免费商用-优雅草老八
2024年12月30日蜻蜓蜻蜓AI工具系统v1.0.0发布-优雅草科技本产品前端源代码已对外开源可免费商用-优雅草老八
351 31
2024年12月30日蜻蜓蜻蜓AI工具系统v1.0.0发布-优雅草科技本产品前端源代码已对外开源可免费商用-优雅草老八

热门文章

最新文章

  • 1
    前端如何存储数据:Cookie、LocalStorage 与 SessionStorage 全面解析
  • 2
    前端工程化演进之路:从手工作坊到AI驱动的智能化开发
  • 3
    Vue 3 + TypeScript 现代前端开发最佳实践(2025版指南)
  • 4
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(五):背景属性;float浮动和position定位;详细分析相对、绝对、固定三种定位方式;使用浮动并清除浮动副作用
  • 5
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(六):全方面分析css的Flex布局,从纵、横两个坐标开始进行居中、两端等元素分布模式;刨析元素间隔、排序模式等
  • 6
    实现“永久登录”:针对蜻蜓Q系统的用户体验优化方案(前端uni-app+后端Laravel详解)-优雅草卓伊凡
  • 7
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(一):CSS发展史;CSS样式表的引入;CSS选择器使用,附带案例介绍
  • 8
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(八):学习transition过渡属性;本文学习property模拟、duration过渡时间指定、delay时间延迟 等多个参数
  • 9
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(九):强势分析Animation动画各类参数;从播放时间、播放方式、播放次数、播放方向、播放状态等多个方面,完全了解CSS3 Animation
  • 10
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(四):元素盒子模型;详细分析边框属性、盒子外边距
  • 1
    前端如何存储数据:Cookie、LocalStorage 与 SessionStorage 全面解析
    384
  • 2
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(九):强势分析Animation动画各类参数;从播放时间、播放方式、播放次数、播放方向、播放状态等多个方面,完全了解CSS3 Animation
    139
  • 3
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(八):学习transition过渡属性;本文学习property模拟、duration过渡时间指定、delay时间延迟 等多个参数
    154
  • 4
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(七):学习ransform属性;本文学习 rotate旋转、scale缩放、skew扭曲、tanslate移动、matrix矩阵 多个参数
    117
  • 5
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(六):全方面分析css的Flex布局,从纵、横两个坐标开始进行居中、两端等元素分布模式;刨析元素间隔、排序模式等
    213
  • 6
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(五):背景属性;float浮动和position定位;详细分析相对、绝对、固定三种定位方式;使用浮动并清除浮动副作用
    266
  • 7
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(四):元素盒子模型;详细分析边框属性、盒子外边距
    132
  • 8
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(三):元素继承关系、层叠样式规则、字体属性、文本属性;针对字体和文本作样式修改
    65
  • 9
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(二):CSS伪类:UI伪类、结构化伪类;通过伪类获得子元素的第n个元素;创建一个伪元素展示在页面中;获得最后一个元素;处理聚焦元素的样式
    129
  • 10
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(一):CSS发展史;CSS样式表的引入;CSS选择器使用,附带案例介绍
    174