一、leaflet源码编译

1、安装cnpm

npm install -g --registry=https://registry.npm.taobao.org cnpm

2、使用cnpm安装所需模块

cnpm install rollup rollup-plugin-git-version rollup-plugin-json git-rev-sync

cnpm install -g uglify-js

3、编译

npm run build

4、说明

编译过程将使用rollup进行代码的打包,使用uglifyjs进行代码的混淆和压缩,编译的文件将输出到dist下

leaflet-src.js                               源码打包文件

leaflet-src.esm.js                       源码打包文件,esm即为EcmaScript Module其支持import from

leaflet.js                                    对源码打包文件进行混淆压缩后的文件

*.js.map       JavaScript Source Map文件,参见:http://www.ruanyifeng.com/blog/2013/01/javascript_source_map.html

二、leaflet.draw源码编译

1、安裝cnpm

npm install -g --registry=https://registry.npm.taobao.org cnpm

2、使用cnpm安装所需模块

cnpm install jake uglify-js@2.8.29 uglifycss source-map git-rev

3、编译

npm run build

4、说明

安装uglify-js时应指定安装版本为2.8.29,使用最新版的uglify-js将导致错误,错误内容为“error: DefaultsError: `fromString` is not a supported option”

编译过程将使用jake进行代码的打包,使用uglifyjs进行代码混淆和压缩,使用和uglifycss进行样式文件的压缩,编译的文件将输出到dist下

leaflet.draw-src.js                          源码打包文件

leaflet.draw-src.css                       样式打包文件

leaflet.draw.js                                对源码打包文件进行混淆压缩后的文件

leaflet.draw.css                             对样式打包文件进行压缩后的文件

*.js.map        JavaScript Source Map文件,参见:http://www.ruanyifeng.com/blog/2013/01/javascript_source_map.html

三、leaflet.toolbar源码编译

1、安裝cnpm

npm install -g --registry=https://registry.npm.taobao.org cnpm

2、使用cnpm安装所需模块

cnpm install -g grunt

cnpm install matchdep

cnpm install grunt grunt-autoprefixer grunt-bump grunt-contrib-clean grunt-contrib-coffee grunt-contrib-concat grunt-contrib-cssmin grunt-contrib-jshint

cnpm install grunt-contrib-less grunt-contrib-nodeunit grunt-contrib-uglify grunt-contrib-watch grunt-contrib-connect grunt-gh-pages grunt-mocha grunt-karma

cnpm install karma karma-mocha karma-phantomjs-launcher karma-chrome-launcher karma-firefox-launcher karma-safari-launcher karma-mocha-reporter karma-coverage

cnpm install leaflet chai sinon@1.10.3

3、编译

打开终端执行:grunt default,再打开一个终端执行:grunt build:js

打开终端执行:grunt test 执行测试代码

4、说明

grunt 编译工具:https://www.gruntjs.net/

四、leaflet-draw-toolbar源码编译

1、安裝cnpm

npm install -g --registry=https://registry.npm.taobao.org cnpm

2、使用cnpm安装所需模块

cnpm install -g grunt

cnpm install matchdep

cnpm install grunt grunt-autoprefixer grunt-bump grunt-contrib-clean grunt-contrib-coffee grunt-contrib-concat grunt-contrib-cssmin grunt-contrib-jshint

cnpm install grunt-contrib-less grunt-contrib-nodeunit grunt-contrib-uglify grunt-contrib-watch grunt-contrib-connect grunt-contrib-copy grunt-gh-pages grunt-mocha grunt-karma

cnpm install karma karma-mocha karma-phantomjs-launcher karma-chrome-launcher karma-firefox-launcher karma-safari-launcher karma-mocha-reporter karma-coverage

cnpm install leaflet leaflet-draw leaflet-toolbar chai sinon@1.10.3

3、编译

打开终端执行:grunt default,再打开一个终端执行:grunt build:js

打开终端执行:grunt test 执行测试代码

4、说明

grunt 编译工具:https://www.gruntjs.net/

leaflet、leaflet-draw、leaflet-toolbar、leaflet-draw-toolbar源码编译相关推荐

  1. leaflet+geoserve+jquery实现简单Webgis系统(附源码下载)

    1.基于leaflet的小系统,源码1000多行,能注释的我都注释了,运行没有任何问题,源码下载链接在评论区: 2.里面用到了很多插件,大部分插件都是使用BootCDN的复制<script> ...

  2. leaflet+postgres+postgis(附源码下载)

    前端使用Jquery和leaflet展示地图,前端jquery封装的ajax通过js的后端运行环境node.js实现和postgres空间数据库的交互.主要实现功能(源代码下载链接在评论区): 1.数 ...

  3. 【ToolBar】Android ToolBar之完全解析

    原文地址:Toolbar:上位的小三 炮兵 镇楼 Toolbar是Android 5.0中新引入的一个控件,其出现的目的就是为了取代ActionBar,在讲解Toolbar之前我们还是来恶补一下关于A ...

  4. Leaflet文档阅读笔记-Leaflet on Mobile笔记

    目录 CSS和HTML改如何设置 定位功能 CSS和HTML改如何设置 如下的设置: body {padding: 0;margin: 0; } html, body, #map {height: 1 ...

  5. leaflet 结合 Echarts4 实现散点图(附源码下载)

    前言 leaflet 入门开发系列环境知识点了解: leaflet api文档介绍,详细介绍 leaflet 每个类的函数以及属性等等 leaflet 在线例子 leaflet 插件,leaflet ...

  6. leaflet 结合 d3.js 实现 geojson 数据地形剖面分析(附源码下载)

    前言 leaflet 入门开发系列环境知识点了解: leaflet api文档介绍,详细介绍 leaflet 每个类的函数以及属性等等 leaflet 在线例子 leaflet 插件,leaflet ...

  7. leaflet地图截图批量导出(附源码下载)

    前言 leaflet 入门开发系列环境知识点了解: leaflet api文档介绍,详细介绍 leaflet 每个类的函数以及属性等等 leaflet 在线例子 leaflet 插件,leaflet ...

  8. Angular + Leaflet 实现房源数据可视化(附github源码)

    这是什么?租房信息展示平台 宏观的租房数据可视化 微观的房源信息展示 多条件搜索 等等 链接 地图搜租房 ​ 来龙去脉 受 @李国宝 的地图搜租房启发,利用其提供的开放API,配合自己在前端和地理信息 ...

  9. C#开发APP,ToolBar控件在Smobiler中的使用方式【附案例源码】——Smobiler移动开发平台...

    控件说明 底部工具栏控件. 效果演示 其他效果 该界面为仿淘宝UI制作的一个简单的UI模板,源码获取方式请拉至文章末尾. 特色属性 属性 属性说明 Direction(相对布局) 容器主轴方向. Fl ...

最新文章

  1. 37 windows_37_Thread_InterLock 线程-原子锁
  2. android之实现各个组件点击事件监听
  3. MindManager 报错:Click to restart mindjet player 解决方法
  4. 一个有趣的python排序模块:bisect
  5. 【30集iCore3_ADP出厂源代码(ARM部分)讲解视频】30-7底层驱动之滴嗒定时器
  6. CSS兼容IE6,IE7,FF的技巧(COPY来的,还没看)
  7. 【转】Azure Messaging-ServiceBus Messaging消息队列技术系列2-编程SDK入门
  8. 算法竞赛入门经典 第五章总结1
  9. 深度解析DDD中台和微服务设计
  10. Gradle 3.0.0设置Apk文件输出命名
  11. PHP开源的项目管理软件
  12. 07 SQL优化技术
  13. 麻瓜编程python web_python web麻瓜编程教程
  14. Yarn FairSheduler使用FairSharePolicy计算Fair Share的规则、原理和代码实现
  15. tcp too many orphaned sockets 问题引发的思考
  16. 如何通过QQ群做网站推广
  17. 深度学习阅读导航 | 04 FPN:基于特征金字塔网络的目标检测
  18. 【新知实验室】腾讯云TRTC实时音视频体验
  19. 打开WPS或office,提示运行时错误‘424’或 运行错误‘429’,ActiveX部件不能创建对象
  20. bidirectional PIM

热门文章

  1. 一份basic文件转化成c文件(自己收藏)
  2. Python利用demoji库删除文档中的表情符号
  3. 计算机网络XP系统电路,WindowsXP系统下建立局域网让多个计算机连接上网
  4. 企业应该如何做好新闻营销推广
  5. spotlight怎么监控linux主机,Spotlight监控Linux服务器
  6. 2022考研时间定了!正式网报时间有变化
  7. 手机综合测试仪 CUM
  8. turtle库绘制奥运五环
  9. 薛定谔分子对接、药效团、3D-QSAR
  10. js将json自动转html表格实例