一、私有库搭建
本文私有库在linux中使用docker搭建
- 拉最新镜像
docker pull verdaccio/verdaccio:latest - 查看镜像
docker image ls | grep verdaccio - 运行容器（普通）
docker run -it -d --name verdaccio -p 4873:4873 verdaccio/verdaccio - 查看运行状态
docker ps -a | grep verdaccio - 可以对docker中的目录进行映射
创建并进入文件夹目录
mkdir /home/verdaccio && cd $_
创建3个文件夹
storage、conf 、plugins
分别修改权限
chown -R 10001:65533 /home/verdaccio/storage
chown -R 10001:65533 /home/verdaccio/conf
chown -R 10001:65533 /home/verdaccio/plugins
- 映射文件夹运行命令：
docker run -it -d --name verdaccio -p 4873:4873 -v /home/verdaccio/storage:/verdaccio/storage -v /home/verdaccio/conf:/verdaccio/conf -v /home/verdaccio/plugins:/verdaccio/plugins verdaccio/verdaccio
同样使用 docker ps -a | grep verdaccio 查看运行状态
成功后在本机ip:4873可看到私有库页面
二、vue发布npm库
创建工程
vue create example- 在
src中创建package文件夹 -
package中新建index.js和example文件夹 - 在
example文件夹中写好你的组件
在本地调试组件库
- 在组件库的
package.json中修改build命令
"build": "vue-cli-service build --target lib ./src/package/index.js --name dist --dest dist"
利用了vue-cli的构建方法，构建单独的入口
-- target lib 关键字 指定打包的目录 后面可以接上entry打包入口
-- name 打包后的文件名字
-- dest 打包后的文件夹的名称
- 打包
npm build 后会产生一个dist文件夹
cd dist
npm init -y 创建package.json
- 在其他项目中引入
npm install <刚刚生成的dist库路径>
配置入口
- 在
index.js中引入组件
import xxxView from "@/package/example/xxx.vue"
import yyyView from "@/package/example/yyy.vue"
const coms = [xxxView,yyyView]
const install = function (Vue) {
coms.forEach(com => {
Vue.component(com.name, com)
})
}
if (typeof window != "undefined" && window.Vue) {
window.Vue.use(comment)
}
export default install
发布
npm set registry ip:4873/npm adduser --registry ip:4873/
npm notice Log in on ip:4873/
Username: 输入用户名
Password: 输入密码
Email: (this IS public): 输入邮箱
设置完成后：Logged in as 你的用户名 on ip:4873/.
- 查看当前用户
npm whoami或npm whoam - 发布库
npm publish --registry ip:4873/
使用你的私有库
- 在根目录创建
.npmrc文件
写入规则：
@xxx:registry=ip:4873
xxx开头的库从 ip:4873 中加载
- 项目中直接使用
npm install xxx
