0

vue-cli构建库

 2 years ago
source link: https://laboo.top/2019/12/28/vue-cli-build/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

vue-cli构建库

Posted on

2019-12-28 Edited on 2021-12-15 In 环境部署

使用vue-cli-service build对开发的库进行打包时使用--target lib

开发时Vue通常是以devDependencies方式引入的只在开发中使用, 使用lib方式打包也一样不会把Vue打包进去

官方文档中描述

在库模式中，Vue 是外置的。这意味着包中不会有 Vue，即便你在代码中导入了 Vue。

打包时通常会提示缺少vue-template-compiler 按以下安装并打包, 打包默认输出路径是./dist

npm install -g @vue/cli-service
npm install -g vue-template-compiler

vue-cli-service build --target lib --name myLib [entry]

在vue.config.js中进行打包相关的配置

module.exports = {
  //不生成 .map 文件
  productionSourceMap: false,
  css: {
    //css合并入js中, 实际使用中发现合并的时候会自动去掉空的class, 导致$style.class 取不到值
    extract: false
  }
}

发布到npm上后, 若需要CDN方式引入, 可以使用unpkg 例如这个项目
https://github.com/GitHub-Laziji/menujs

<script src="https://unpkg.com/vue-contextmenujs/dist/contextmenu.umd.js">

report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK