项目地址:loan-calculate-utils npm包的发布.更新查看上一篇文章 开发一个基础的npm包 目前我们的目录是这个样子: . ├── source 源代码目录 │   └── index.js ├── package.json └── README.md 接下来给项目添加 打包,忽视文件,ts声明文件,单元测试,eslint,README.md添加徽标. 打包 参考 ramda 打包思路,我们将要编译成三种包,以及它们的压缩版. 打包目标 umi: babel source -

React 面向组件化编程 面向对象 ----> 面向模块 ----> 面向组件 套路: 注意: 组件名必须大写开头: 只能有一个根标签: <input />虚拟DOM 元素必须有结束标签 方式1. 工厂函数组件 (简单组件) ----> 只能定义无状态的组件 function MyComponent(){ // 只能 大写开头,区别于普通函数 return <h2>工厂函数组件(简单组件)</h2> } // 渲染函数组件标签// 内部直接调用 工厂

以markdown-clear,创建过程为例,讲解整个NPM包创建和发布流程 1 如何创建一个包 1.1 创建并使用一个工程 在GitHub上新建一个仓库,其名markdown-clear clone 这个工程到本地 1.2 添加LICENCE或LICENSE文件, 说明对应的开源协议 到SPDX License List 或者Open Source Initiative,下载相应协议的模板,我们这里选用MIT 修改必要的协议时间和作者 MIT License Copyright (c) <ye

最近一段时间在用electron+vue做内部项目的一键构建发布系统的桌面应用,现就其中打包流程写个备注,以示记录. Windows环境打包:1.首先贴一下package.json. { "name": "******",//隐藏项目名 "version": "**.**.**",//隐藏版本号 "author": "*** <***>",//隐藏作者信息 "des

NPM是Node.js的包管理工具,随着Node.js的出现,以及前端开发开始使用gulp.webpack.rollup以及其他各种优秀的编译打包工具(大多数采用Node.js来实现),大家都开始接触到一些Node.js,发现了使用NPM来管理一些第三方模块会很方便.大家搬砖的模式也是从之前的去插件官网下载XXX.min.js改为了npm install XXX,然后在项目中require或者import. 当然,NPM上边不仅仅存在一些用来打包.引用的第三方模块,还有很多优秀的工具(包括部分打

前言:工作的时候总是使用别人的npm包,然而我有时心底会好奇自己如何发布一个npm包呢,什么时候自己的包能够被很多人喜欢并使用呢...今天我终于迈出了第一步. 前提:会使用 npm,有 vue 基础,了解一点 webpack Are you ready?  Go! 目录 编写自己的npm包 发布npm包 使用自己的npm包 更新npm包 最终效果 一.编写自己的npm包 1. 新建一个空文件夹 2. 进入文件夹,终端(cmd)运行 npm init 完成后会在目录下生成一个 package.js

欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由小明plus发表 很多时候,我们可能想要用 typescript 语言来创建一些模块,并提交到 npm 供别人使用, 那么在 2018 年,如果我想要初始化这样的一个模块,我需要做哪些步骤呢?: 答案是:创建一个优雅的,对开发者友好的模块,至少需要以下 15 个步骤 初始化文件夹,初始化 git 仓库,初始化 npm,初始化 tsc 修改 tsconfig.js 配置 添加 npm 脚本 添加 tslint 校验代码规则以及 ed

whale-makelink是一个npm工具,是强业务的工具,可以将当前工程目录下的项目文件夹,在README中生成项目的链接地址.Demo. 一.npm init 使用npm init生成package.json { "name": "whale-makelink", "version": "1.0.5", "description": "Make-link can get all the pr

[npm run build] npm 会在项目的 package.json 文件中寻找 scripts 区域,其中包括npm test和npm start等命令. 其实npm test和npm start是npm run test和npm run start的简写.事实上,你可以使用npm run来运行scripts里的任何条目. 使用npm run的方便之处在于,npm会自动把node_modules/.bin加入$PATH,这样你可以直接运行依赖程序和开发依赖程序,不用全局安装了.只要np

下雪了,在家闲着,不如写一个npm 包发布.简单的 npm 包的发布网上有很多教程,我就不记录了.这里记录下,一个复杂的 npm 包发布,复杂指的构建环境复杂. 整个工程使用 rollup 来构建,其中会引进 babel 来转译 ES6,利用 Eslint 来规范代码的书写风格,最后代码的发布会经过 uglify 压缩.同时发布 umd.es 格式的版本以供外部调用. 完整目录结构如下: 下面是整个过程的记录 一.初始化工程 yarn init -y 初始化后,修改 package.json 内

这段时间公司新项目立项,开发组选用 Vue2.0 进行开发.当然也就一并用到 vue cli 进行自动化构建.结果在基础版本开发完成后,用 npm run build 命令打包上线时,发现以下几个问题.虽然这些问题对项目正常运行影响不大,但是却对性能影响比较大. 1.加载图片过多,过大时,加载缓慢: 2.部署包过大,上传缓慢: 本来想偷个懒,优化的事放到以后再说,但是每次上传服务器,包太大自己都感觉不爽.所以索性先优化了再说! 1.加载图片过多,过大时,加载缓慢: 原因: 解决方案: 2.部署包

一.目的 主要是纪录和回顾自己开发的一些步骤以及遇到的一些问题和解决方案 二.准备工作 1.IDE 选择 VS Code 2.安装node 环境 (https://nodejs.org/zh-cn/) 3.git仓库  gitlab (https://gitlab.com) (1)  注册 (2)add ssh key(可以看一下 https://gitlab.com/help/ssh/README.md) (3)新建project (4)git clone 到本地 (5)  工程下执行 npm

由于升级了 v0.2 版 GearCase 使用打包工具从 parcel 更换成 vue-cli 3.x.因此打包后发布 NPM 包的方式与之前有很大的差异,这也导致了在发布完 GearCase v0.2.2 版本之后,我自己在进行 NPM / Yarn 安装包时.根本无法通过之前文档的方式,进行引入并注册组件.后来我大概花费了两天的时间来解决这个问题. 回顾 由于 parcel 的打包方式与 webpack 有很大的差异.并且当时还处于轮子库 v0.1 版本,引入/注册组件的方式也有不同. 详

graphql 比较方便的进行api 的查询,操作,swagger 是一个方便的open api 描述标准,当前我们有比较多的 restapi 但是转换为graphql 是有成本的,还好swagger-to-graphql 这个npm 包帮助我们简化了操作 基本项目 具体项目参考 https://github.com/rongfengliang/swagger-to-graphql-docker 项目结构 ├── Dockerfile ├── README.md ├── api │ └── s.

前言 npm(Node Package Manager),一个Node的包管理器,平时我们常用的公共模块(插件)或者叫做包大多都放在上面,所以接下来要封装的插件,我们就简单称它为npm包,本文从就从这个简单的例子开始,逐步对它进行封装-发布-更新-扩展-使用,进而到得一个相对完整的npm包,下面开始. 一.一个最简单的npm包 1.1 新建文件夹 可以找个地方直接建个文件夹,最好语义化一点,这样以后也方便管理,我们这里用终端建文件夹: mkdir toupper-case-project //

前言 我这里是写了一个vue轮播图插件,因此我使用了vue的脚手架工具创建一个项目,当然你也可以选择自己搭建脚手架. 本例中我会使用vue脚手架创建一个项目,并发布到npm上面去. 通过脚手架创建项目 全局安装 首先,要创建项目,封装vue的插件用webpack-simple很合适,因此你需要全局安装@vue/cli-init插件: yarn global add @vue/cli-init //或者 npm install @vue/cli-init -g 使用vue init webpack

1.环境准备 安装node,npm,@vue/cli 2.初始化项目 用@vue/cli创建新项目 vue create mtest-ui 删除public,main.js,App.vue等无关文件,新增packages文件夹存放自己的vue组件 这里我写了一个actionsheet的vue组件放到packages文件夹中 并且在src目录中新增了个js,目录像这样: 其中lib目录是后续打包生成的先不用管 其中index.js是为了把packages中的组件提供一个统一入口来import 代码

创建自己的模块组件 1. ng new 一个工程 2. ng g m 创建模块 例如我这里的modules文件下创建header模块 3. ng g c modules/head 创建一个hear组件,内容随意 4. 将modules模块exports出去,让其他模块可以使用 5. 做个测试在app模块中引入modules模块,并使用header组件 发布前的准备 1.   安装ng-packagr 并在devDependency中声明 npm install ng-packagr --save

1-10是开发流程,后面的是发布流程 1. 在Git里面…新建项目   2. 克隆项目到本地用来开发 git clone https://github.com/***/vue-prevent-browser-back.git 3. 运行命令行,初始化项目,生成package.json     npm init –y 4. npm install 安装包 5. 在安装vue-cli的情况下执行 vue-init webpack-simple创建项目结构 6. 删除多余文件 index.html清空

从0到1发布一个npm包 author: @TiffanysBear 最近在项目业务中有遇到一些问题,一些通用的方法或者封装的模块在PC.WAP甚至是APP中都需要使用,但是对于业务的PC.WAP.APP往往是不同的业务.不同的代码库中,尽管已经将公用的组件和方法抽离到各自公共common中,但是各个大业务大方向上的公用封装依然不能满足需求. 比如一个计算文档类型大小的方法,可能都同时存在于各个业务的common中,假设是有3处代码库中均有:如果此时的需求是将文档类型或者大小的方法进行一些修改,