前言: 工作了几年,想把一些不好找现成的库的常用方法整理一下,发布成npm包,方便使用.也学习一下开发发布流程. 主要用到的工具:npm. 开发库:babel.typescript.rollup.eslint.corejs. 由于目前只是发布一些函数方法,只需要一些兼容性工具,打包工具即可. 一.创建项目 可以直接在github上创建一个空项目,然后克隆到本地. 进入目录下,执行 npm initz 之后将开始初始化package.json: This utility will walk you

cordova 插件发布到 npm Cordova插件开发(3)- 将Cordova插件发布到npm could not find an installed version of gradle either in android studio ionic ionic开发--编译出错:You have not accepted the license agreements of the following SDK component

前言 ​ 面对越来越多的组件库,越开越多的ui库,学会发布库已经是前端必须会的事情了,也算是为开源贡献一份力量,在网络上看了一些前者的文章,也算的发布成功了,虽然还存在很多问题,路不积跬步,无以至千里,一步一步来吧 参考文章

1. 前言 最近在学习 Webpack 相关的原理,以前只知道 Webpack 的配置方法,但并不知道其内部流程,经过一轮的学习,感觉获益良多,为了巩固学习的内容,我决定尝试自己动手写一个插件. 这个插件实现的功能比较简单: 默认清除 js 代码中的 console.log 的打印输出: 可通过传入配置,实现移除 console 的其它方法,如 console.warn.console.error 等: 2. Webpack 的构建流程以及 plugin 的原理 2.1 Webpack 构建流程

为了摆脱咸鱼的身份,我给自己定了一个开源项目的目标 于是抽空写了一个 textarea,打算发布到 npm 的时候却遇到了问题 之前用 vue-cli 2.x 的时候,打包配置项非常透明,可以很容易的修改 但升级到 vue-cli 3.x 之后,反而一脸懵逼... 在踩了一天的坑之后,终于成功发布了一个小插件,于是记个笔记 一.调整项目结构 首先用 vue-cli 创建一个 default 项目 // 顺便安利一篇文章<Vue 爬坑之路(十二)—— vue-cli 3.x 搭建项目> 当前的项

前言 写此文前特意google了一下,因为有较详细的开发教程我再写意义不大,有把插件封装成组件的教程,有把自己的组件封住成插件的教程,本文主要说明如何把第三方的插件封装成vue插件,简化配置,一键安装,主要提供思路,封装方法大同小异·,文章略长要有耐心. gitment gitment是一个基于github issues封装的评论插件,以这个插件作为演示,把它封装成vue插件.vue-gitment,该插件已发布到npm,并在自己的开源项目vueblog中安装使用 项目初始化 封装vue的插件用

vue封装插件并发布到npm上 项目初始化 首先,要创建项目,封装vue的插件用webpack-simple很合适,vue init webpack-simple 项目名称此命令创建我们的项目的目录,创建文件夹和文件,最后结构是这样的  然后根据需求,实现具体功能,这里我封装了一个轮播图组件mini-sliders,主要功能写在lib/slider.vue组件中 功能写好后,我们要写index.js来封装组件 import VueComment from './VueComment.vue' c

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清空

干货转载——https://www.cnblogs.com/wisewrong/archive/2018/12/28/10186611.html 全是知识点呐 赶紧记下来啊 一.调整项目结构 首先用 vue-cli 创建一个 default 项目 // 顺便安利一篇文章<Vue 爬坑之路(十二)—— vue-cli 3.x 搭建项目> 当前的项目目录是这样的: 首先需要创建一个 packages 目录,用来存放组件 然后将 src 目录改为 examples 用作示例 二.修改配置 启动项目的

创建自己的library类库包并使用webpack4.x打包发布到npm 我们在开发过程中,可能经常要使用第三方类库,比如jquery.lodash等.我们通过npm,下载安装完之后,就可以使用了,简单方便.我们自己可以创建一个类库,然后供其他人这样安装使用吗?当然是可以的. 下面我们就来说说. 1. 创建自己的类库 index.js import numRef from './ref.json' // 此文件请查看源码 const numberWord = () => { const numT

原文链接:https://www.jianshu.com/p/091a68ea1ca7 写在前面 在做react-native开发的时候,我们经常会找到一些第三方组件,并且通过npm install的方式很方便的安装使用.在使用的同时,你是否想过,我们自己应该如何开发并发布一个组件呢?不管是给自己的多个项目共用,或者开源给到别人用,这都是一件很酷的事情. 那么今天,我就以我自己开发的一个在ios和android通用的CardView组件为例来讲一下,如何开发一个自己的组件,并开源到github.

最近公司有个需求,我们部门开发一个平台项目之后,其他兄弟部门开发出的插件我们可以拿来直接用,并且不需要我们再进行打包,只是做静态的文件引入,研究一波后发现,webpack创建library可以实现. 创建library 完整代码 核心代码为 output: { path: DIST_PATH, publicPath: "", chunkFilename: "[name].js", filename: "testPlugin.js", librar

如何发布一个包到npm First 在https://www.npmjs.com注册一个账号. Second 编辑好项目,文件大致如下: 其中,gitignore可以如下: .DS_Store node_modules/ dist/ 注意:不能包含 npm-debug.log . Third: npm login Fourth: npm publish 注意:如果使用了cnpm(默认使用),会报错:no_perms Private mode enable, only admin can publ

前言 我这里是写了一个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

前言:之前在网上找的好多都是基于vue-cli 2.x的,而使用vue-cli 3的文章比较少,Vue CLI 3 中文文档,所以我在自己尝试的时候把几篇文章结合了一下,调出来了我想要的模式,也就是Vue CLI 3 + element-ui + 多个二次封装的组件.最终想要的是 element-ui 这种感觉的,很多组件可以在不同项目中复用. 安装依赖 首先用Vue CLI 3来初始化项目 yarn global add @vue/cli vue create qiyun-el-ui vue

简要:这篇文章介绍了如何讲自己的包发布到NPM上,马克一下,将来有用 ... npm包发布 发布npm包,更方便以后下载使用. 我们已经把插件代码上传到github上面了,那么我们是否可以也做成一个npm包发布到npm上呢?答案是肯定的,如此一次,我们在需要使用到该插件的时候就可以直接npm i vpay等的实现安装到我们的项目中,岂不是很方便呢? 正如文章刚开始提到的文件目录,我们是把插件都写在了第二个lib中的.而整个vpay文件夹都是我们要作为npm包发布的.其中readme.md是说明文

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

博客地址:https://ainyi.com/81 基于 element ui 的==升级版穿梭框组件==发布到 npm 啦 看过我之前博客的同学或许知道我之前写过关于 element 穿梭框组件重构的博客 关于 Element 组件的穿梭框的重构,当时还有一些同学直接通过微信询问很多关于这个组件的问题 去年在上家公司就重构过的穿梭框,一直懒得封装成一个 Vue 组件发布到 npm,现在趁着目前比较闲,就这几天继续完善和优化.迭代更新 + 封装,终于发布啦~ krry-transfer 基于 E

一.创建项目 1.vue create xxx (使用的版本是3.1.0) 2.把src目录名称改为examples 3.新建文件夹packages 用来存放组件 4.比如:新建Button组件 index.vue是用来编写组件的文件,index.js是对外引用,导出文件: import Button from './index.vue'; /* istanbul ignore next */ Button.install = function(Vue) { Vue.component(Butt

自从工作以来,写项目的时候经常需要手写一些方法和引入一些js库 JS基础又十分重要,于是就萌生出自己创建一个JS工具库并发布到npm上的想法 于是就创建了一个名为learnjts的项目,在空余时间也写了几个工具函数,后续还会再继续增加... 这篇文章就是一篇实战文章,我把自己创建项目,发布到npm,以及遇到的问题和解决方案全都记录了下来,如果你也想创建一个自己的js工具库,可以根据这篇文章一步一步的尝试一下 github项目地址 npm项目地址 创建项目 打开命令窗口,创建一个项目文件 mkdi

什么是脚手架 在项目比较多而且杂的环境下,有时候我们想统一一下各个项目技术栈或者一些插件/组件的封装习惯,但是每次从零开发一个新项目的时候,总是会重复做一些类似于复制粘贴的工作,这是一个很头疼的事情,所以各种各样的脚手架应用而生. 脚手架也就是为了方便我们做一些重复的事情,快速搭建一个基本的完整的项目结构.例如:vue-cli, react-cli, express-generator 以vue-cli为例 1.全局安装vue-cli npm install vue-cli -g 2.然后在终端