qlue-app-scripts 是一款帮助前端工程师快速初始化工程、提高工程构建效率的 npm 包。它集成了一系列列工程构建工具，如 Webpack、Babel、Less 等，并且提供了可扩展的配置。
本篇文章将详细介绍如何使用 qlue-app-scripts 快速搭建前端工程，包括安装、配置、构建等方面的内容。
安装
在命令行中执行以下指令安装 qlue-app-scripts：
--- ------- ---------------- ----------
配置
在项目根目录下创建 qlue.config.js 文件，并编写一下内容：
-------------- - -
------ --------------- -- ----
------- ------- -- ----
------------- ----------------- -- ---- ----
------------------ -
-------
-- -- --- ----- ------- --
--在以上配置中，entry 表示入口文件；output 表示输出路径；htmlTemplate 表示 HTML 模板文件路径；extraBabelPresets 表示额外的 Babel Presets 配置。
构建
在命令行中执行以下指令，即可开始构建：
--- --- ---
执行以上指令后，qlue-app-scripts 将开始根据配置构建项目，并在浏览器中自动打开页面进行预览。
示例代码
下面是一个使用 qlue-app-scripts 的示例代码：
------ ----- ---- -------- ------ -------- ---- ------------ ------ --- ---- ------------------- ---------------- ---- --- ------------------------------- --
上述代码中，我们通过 import 引入了 React 和 ReactDOM，并用其渲染了一个名为 App 的 React 组件。在 ReactDOM.render() 方法中，我们将 App 组件作为参数传入，并指定了渲染的目标元素为 root。
总结
通过本文的介绍，我们了解了如何使用 qlue-app-scripts 快速搭建前端工程。它提供了一系列的配置选项，并将 Webpack、Babel、Less 等工程构建工具集成在一起，方便了我们进行前端工程的快速构建。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/67900