前端模块管理器简介

作者: 荞叶 | 来源:发表于2016-07-21 10:50 被阅读95次

Bower

安装bower

  $ npm install -g bower

安装依赖包,安装在项目目录的bower_components

  $ bower install jquery

使用包

  <script src="bower_components/jquery/dist/jquery.min.js"></script>

Browserify

Browserify本身不是模块管理器,只是让服务器端的CommonJS格式的模块可以运行在浏览器端。这意味着通过它,我们可以使用Node.js的npm模块管理器。所以,实际上,它等于间接为浏览器提供了npm的功能。

安装browerify

  $ npm install -g browserify

编写JavaScript代码

  var unique = require('uniq');
  var data = [1, 2, 2, 3, 4, 5, 5, 5, 6];
  console.log(unique(data));

安装uniq依赖

  npm install uniq

打包引入依赖

上面代码中uniq模块是CommonJS格式,无法在浏览器中运行。这时,Browserify就登场了,将上面代码编译为浏览器脚本。

  browserify main.js -o bundle.js

生成的bundle.js可以直接插入网页。

  <script src="bundle.js"></script>

相关文章

  • 前端模块管理器简介

    Bower 安装bower 安装依赖包,安装在项目目录的bower_components下 使用包 Browser...

  • npm和bower

    npm属于node模块的管理器。 spm和bower是前端模块管理。 bower 的话,从一开始,就是专门为前端表...

  • kafka源码愫读(6)、GroupCoordinator模块源

    1、GroupCoordinator及相关组件简介 GroupCoordinator模块为Consumer管理器,...

  • 前端模块化的发展概述

    前端模块化简单梳理 本篇简介 关于前端模块化的一些知识,如CMD/AMD/Webpack等,之前都进行过专门学习,...

  • RN精进笔记(十三)npm命令和机制

    [toc] NPM 模块安装机制简介 npm是Node的模块管理器,功能很强大。它是Node获得成功的原因之一。正...

  • 模块化

    一、 模块化简介 随着前端js代码复杂度的提高,JavaScript模块化这个概念便被提出来,前端社区也不断地实现...

  • node模块化1

    一、模块化简介 随着前端js代码复杂度的提高,JavaScript模块化这个概念便被提出来,前端社区也不断地实现前...

  • node.js 模块化 day2(2019.6.1)

    一、模块化简介 随着前端js代码复杂度的提高,JavaScript模块化这个概念便被提出来,前端社区也不断地实现前...

  • 前端模块化开发简介

    前端模块化开发简介 历史上,JavaScript 一直没有模块(module)体系,无法将一个大程序拆分成互相依赖...

  • 前端核心工具:yrn、npm、cnpm三者如何优雅的在一起使用

    一位用不好包管理器的前端,是一个入门级前端,一个用不好 webpack 的前端,是一个初级前端 三个包管理器是可以...

网友评论

    本文标题:前端模块管理器简介

    本文链接:https://www.haomeiwen.com/subject/oorbjttx.html