X-BUILD一套基于Webpack(v4.21.0)快速搭建H5场景开发环境的脚手架,只需要几分钟的时间就可以运行起来。X-BUILD是针对H5开发的一套自动化构建工具,致力于提升开发效率,减小开发难度。它可以让你在没有任何构建工具(例如 grunt 、 gulp 或 webpack 等工具)配置经验的情况下,帮你快速生成一个完整的前端工程,并可以打包代码和静态资源,使你的项目以最优异的性能上线。

针对痛点

✅ 零配置,快速搭建繁琐的开发环境搭建。

✅ 解决多终端屏幕适配以及代码兼容性、规范性。

✅ 代码压缩、静态资源压缩、更少的HTTP请求。

✅ 可选插件,提升开发效率,易于扩展。

功能特性

Speciality Description
devServer 模块热替换(HMR - Hot Module Replacement)可以显著加快开发速度。
自适应解决方案 px2rem(loader) + hotcss 实现多终端显示一致。
HTML 使用Pug模板引擎,风格与Stylus类似。
Css 使用Stylus样式预处理器,normalize样式重置,打包拆分单独的css文件。
JavaScript Webpack解决模块化,通过Babel编译成现代浏览器可执行的JavaScript。
代码规范 使用ESLint避免低级错误和统一代码的风格。
静态资源服务 提供代码压缩、文件hash、base64处理等服务。

中文文档

https://codexu.github.io/

原文地址:https://segmentfault.com/a/1190000017054527

H5新人福音~零配置搭建现代化的前端工程的更多相关文章

  1. 从0开始基于Webpack5 搭建HTML+Less 前端工程

              基于Webpack5 搭建HTMl+Less的前端项目 新建一个文件夹(比如命名为webpack) 用编辑器打开该文件夹,并在编辑器的终端执行 npm init -y 自动创建pa ...

  2. Spring4.X + spring MVC + Mybatis3 零配置应用开发框架搭建详解(1) - 基本介绍

    Spring4.X + spring MVC + Mybatis3 零配置应用开发框架搭建详解(1) - 基本介绍 spring集成 mybatis Spring4.x零配置框架搭建 两年前一直在做后 ...

  3. 模拟Springboot一:(零xml配置搭建SSM项目)

    在spring官网文档中无论是spring的基础文档,还是spring-mvc文档都推荐我们使用javaconfig的方式来搭建项目 间接说明 (优点:javaconfig配置>xml配置) 其 ...

  4. 【Parcel 2 + Vue 3】从0到1搭建一款极快,零配置的Vue3项目构建工具

    前言 一周时间,没见了,大家有没有想我啊!哈哈!我知道肯定会有的.言归正传,我们切入正题.上一篇文章中我主要介绍了使用Vite2+Vue3+Ts如何更快的入手项目.那么,今天我将会带领大家认识一个新的 ...

  5. 零配置文件搭建SpringMVC实践纪录

    本篇记录使用纯java代码搭建SpringMVC工程的实践,只是一个demo.再开始之前先热身下,给出SpringMVC调用流程图,讲解的是一个http request请求到达SpringMVC框架后 ...

  6. Spring boot 零配置开发微服务

    2018年12月29日星期六 体验Spring boot 零配置开发微服务 1.为什么要用Spring  boot? 1.1 简单方便.配置少.整合了大多数框架 1.2 适用于微服务搭建,搭建的微服务 ...

  7. 零配置文件搭建SpringMvc

    零配置文件搭建SpringMvc SpringMvc 流程原理 (1)用户发送请求至前端控制器DispatcherServlet:(2) DispatcherServlet收到请求后,调用Handle ...

  8. 零基础搭建 spring mvc 4 项目(本文基于 Servlet 3.0)

    作者各必备工具的版本如下: Tomcat:apache-tomcat-7.0.63 (下载链接) Java EE - Eclipse:Luna Service Release 1 v4.4.1 (下载 ...

  9. 零成本搭建个人博客之图床和cdn加速

    本文属于零成本搭建个人博客指南系列 为什么要使用图床 博客文章中的图片资源文件一般采用本地相对/绝对路径引用,或者使用图床通过外链进行引用展示.本地引用的弊端我认为在于: 图片和博客放在同一个代码托管 ...

随机推荐

  1. Gitlab备份,Crontab定时备份

    1:Gitlab备份非常简单,只需要一条命令就可以创建完整的备份 gitlab-rake gitlab:backup:create 使用以上命令,就相当于在/var/opt/gitlab/backup ...

  2. 新手搭建springmvc+mybits框架的经验分享

    1.搭建过程中遇到的问题: ①由于是第一次使用springmvc框架,对它的认识真的很浅,只知道他属于spring旗下的产品,仅此而已.于是搭建过程中确实遇到不少麻烦,因为之前的项目都是老师带着做的, ...

  3. [题解](背包)luogu_P4095 eden的新背包问题

    有一点乱搞吧......对人对背包的理解有些考验,要想知道去掉某个点的值,可以选择对前缀求一次背包,后缀求一次背包,而且不省掉价钱那一维, 这样每个点就可以由前后组合成了,枚举一下价钱取max即可 直 ...

  4. UVA10129:Play on Words(欧拉回路)

    Some of the secret doors contain a very interesting word puzzle. The team of archaeologists has to s ...

  5. POJ 1458 Common Subsequence DP

    http://poj.org/problem?id=1458 用dp[i][j]表示处理到第1个字符的第i个,第二个字符的第j个时的最长LCS. 1.如果str[i] == sub[j],那么LCS长 ...

  6. CSS 条纹背景深入

    一.水平渐变 实现水平条纹很简单 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

  7. postman中添加cookie信息

    日常测试中有部分接口请求需要有登录信息,否则调用报错,那如何在postman中添加用户的cookie呢,主要分2个步骤: 第一步: Charles抓包获取Headers信息,拷贝Headers中的Co ...

  8. CSS Secrets 翻译笔记 01: CSS coding tips

    .firDemoButton{ padding: 6px 16px; border: 1px solid #446d88; background: #58a linear-gradient(#77a0 ...

  9. 详解HTML中的表格标签

    详细代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" ...

  10. ios 自定义消息提示框

    自定义提示框,3秒钟后自动消失.如上图显示效果. 提示框加载代码: - (void)viewDidLoad { [super viewDidLoad]; //将view背景颜色变更为黄色 self.v ...