coolie 入门之介绍和安装以及准备工作

发布于 2021-12-01 13:07:19 字数 3045 浏览 1157 评论 0

1、大环境

如今,随着模块化思想的流行,越来越多的前端开发已经介入到模块化开发当中来了,模块化约定和规范也更加的完整,ECMAScript 也已经将其纳入标准制定计划当中。因此,可以说前端模块化是一个大趋势,更是随着 NodeJS 的风靡,加速了这一过程。本文及接下来的几篇文章介绍的 coolie(苦力),是模块化的一个相对完整的实现和解决方案。

2、coolie 介绍

coolie,苦力。模块好比是集装箱,coolie 是搬运合适集装箱的一个苦力,因此请善待它。coolie 分为两部分,一部分是前端模块加载器,另一部分是前端发布工具。

  • 模块加载器:参考了业界比较流行的模块化加载器 seajs,以及其他比较流行的模块加载器。
  • 前端发布工具:参考了 seajs 的模块构建工具 spmjs,以及其他比较流行的模块构建工具。

为什么不使用seajs或是其他业界流行的解决方案呢?

coolie 作为模块加载器,更加的纯净,API 接口非常的简单,几乎零配置。以至于书写模块的时候与 nodejs 几乎一致,只是头尾增加了 define 包裹。当然,nodejs 模块的运行也是如此,运行过程中会添加 define 包裹。业界中比较流行的 模块加载器为了支持各种特性添加了各种配置,纷乱繁杂,增加用户的选择成本和学习成本。coolie 的简约是它的一个亮点,并且 coolie 目前只兼容 IE9 以上已经兼容到 IE6+ 浏览器,高级特性使它保持了良好的身材。

coolie 作为前端发布工具,完整的解决了模块的依赖分析、依赖构建、模块压缩等,以及 CSS、HTML 的压缩合并等。使用简单,容易入门,没有各种复杂配置,只需要一条命令即可完成一个发布。与其他模块构建工具相比,coolie 的特色在于能够压缩模块的路径为单个字符,发布之后动态版本号,不会造成缓存困扰。

开发与生产环境的代码对比

img.png

img.png

img.png

img.png

3、下载安装

3.1、安装 nodejs

nodejs 是一个基于 Chrome V8 引擎的服务平台,使用 nodejs 可以创建 web 程序,本地应用等项目,使用 Javascript 编码,具有的无阻塞异步特性。访问 nodejs 官网,按照指定操作系统来安装 nodejs。

3.2、安装 coolie

在安装完成 nodejs 后,系统已经有了2个命令,分别是 node 和 npm。node 是运行程序,npm 是 nodejs 包管理服务(nodejs package manager)。

coolie 是全局模块,因此需要全局安装:

npm install -g coolie

参数 g 的意思是 global,表示全局安装。

安装完成后,在命令窗口输入

coolie

即可看到如下信息

img.png

如果你之前已经下载过 coolie,建议你检查下最新的版本号。

img.png

4、必备知识

在接下来的文章里,将指引如何使用 coolie 以及 coolie 的执行原理,为了更好的理解,你可能需要预先了解以下知识。

  • 如何使用命令,在 cmd、终端里使用命令行操作。
  • 了解 AMD、CMD、CommonJS 之间的区别。
  • 具有模块化编程的理念。
  • 能够使用模块化编程。
  • 生产环境与开发环境之间的代码区别。
  • 前端发布过程具体需要涉及哪些方面。
  • 如何在生产环境下前端最优化。

5、参考链接

  • coolie:https://www.npmjs.com/package/coolie
  • alien:https://github.com/cloudcome/alien
  • seajs:http://seajs.org/
  • requirejs: http://requirejs.org/
  • nodejs:http://nodejs.org/
  • npmjs: https://www.npmjs.com/

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据

关于作者

0 文章
0 评论
597 人气
更多

推荐作者

‘画卷フ

文章 0 评论 0

寂寞清仓

文章 0 评论 0

脸赞

文章 0 评论 0

WeiBestSmart

文章 0 评论 0

娇女薄笑

文章 0 评论 0

国粹

文章 0 评论 0

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文