使用Vue-cli3.0创建的项目,如何发布npm包
使用Vue-cli3.0创建的项目,如何发布npm包
在使用
vue
进行项目开发时,如果我们想要发布一个包,有时候会有点迷糊,不知道应该怎么修改脚手架的默认设置。这里记录一下一些常见的操作。
创建index.js进行模块的导出
将我们需要导出的组件在index.js
文件中进行统一导出,可能之前需要进行处理,是先进行全局注册Vue.component
,还是用户自己注册。
import App from './App.vue'
export default App;
修改vue.config.js配置文件
修改publicPath
的路径为相对路径
module.exports = {
lintOnSave: false,
runtimeCompiler:true,
publicPath: './',
}
修改package.json中的script
vue-cli
默认给我们设置了build
,但是我们不使用这个build
,而是打包我们之前创建的index.js
文件
新增build-bundle
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"build-bundle": "vue-cli-service build --target lib --name AutoForm ./src/index.js",
"lint": "vue-cli-service lint"
},
修改package.json中的main
这里的main是打包后的程序入口,也就是我们通常下载一个包后使用import xxx from YYY
默认从node_modules
下查找的文件,因此,我们需要修改为我们打包后的文件名,否则查找不到这个文件。
"main": "dist/AutoForm.common.js",
这样的话,一个包就修改完成,打包后正常发布就可以使用了。
使用Vue-cli3.0创建的项目,如何发布npm包的更多相关文章
- vue cli3.0快速搭建项目详解(强烈推荐)
这篇文章主要介绍下vue-cli3.0项目搭建,项目结构和配置等整理一下,分享给大家. 一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@vue/cl ...
- vue 2.0创建新项目
参考链接 https://segmentfault.com/a/1190000011275993 背景在安装完node的基础上,机器什么都没安装参考上述链接 一.下载vue $ cnpm insta ...
- vue cli3.0打包
1.vue cli3.0需要在项目根目录下配置webpack 包括反向代理以及打包文件路径 const webpack = require("webpack"); module. ...
- VUE CLI3.X 创建项目
Node.js环境搭建 Node.js基于V8引擎,可以让js代码脱离浏览器运行 Vue CLI3.0 需要Node.js 8.9或者更高版本. 用nvm或者nvm-windows在同一台电脑中管理多 ...
- vue cli3.0 结合echarts3.0和地图的使用方法
echarts 提供了直观,交互丰富,可高度个性化定制的数据可视化图表.而vue更合适操纵数据. 最近一直忙着搬家,就没有更新博客,今天抽出空来写一篇关于vue和echarts的博客.下面是结合地图的 ...
- .Net Core .Net Core V1.0 创建MVC项目
.Net Core V1.0 创建MVC项目 创建MVC项目有两种方式: 一.创建Web项目:(有太多没用的东西要去删太麻烦) 2.项目目录结构: 此种方法要注意的是,会创建好多个json文件,下面就 ...
- 解决vue/cli3.0 语法验证规则 ESLint: Expected indentation of 2 spaces but found 4. (indent)
当你使用vue/cli3.0的时,有可能出现雁阵规则 ESLint: Expected indentation of 2 spaces but found 4. (indent) 解决方法 1.在vu ...
- 01-路由跳转 安装less this.$router.replace(path) 解决vue/cli3.0语法报错问题
2==解决vue2.0里面控制台包的一些语法错误. https://www.jianshu.com/p/5e0a1541418b 在build==>webpack.base.conf.j下注释掉 ...
- 在使用vue+webpack模版创建的项目中使用font-awesome
前言:最近使用vue+webpack进行一个小项目的开发,按照官方模版文档完成项目初始化后打算引入ont-awesome字体图标库进行使用,引入过程中遇到一些问题并解决,现记录如下. 一开始进展很顺利 ...
随机推荐
- Linux服务器部署.Net Core笔记:二、安装FTP
1.安装 安装ftp:yum install -y vsftpd 将ftp设置开机启动:systemctl enable vsftpd.service 2.配置 安装好后在ftp配置文件里进行配置 : ...
- Sqlite—删除语句(Delete)
SQLite 的 DELETE 语句用于删除表中已有的记录.可以使用带有 WHERE 子句的 DELETE 查询来删除选定行,否则所有的记录都会被删除. SQLite 要清空表记录,只能使用Delet ...
- 面试连环炮系列(一):如何保证Redis高可用和高并发
如何保证Redis高可用和高并发? Redis主从架构,一主多从,可以满足高可用和高并发.出现实例宕机自动进行主备切换,配置读写分离缓解Master读写压力. Redis高可用方案具体怎么实施? 使用 ...
- 可编程实验板EPM1270T144C5蜂鸣器音调频率选择
always@(tone) begin case(tone) 'd1 : time_end=10'd1911 ;//L1 'd2 : time_end=10'd1702 ;//L2 'd3 : tim ...
- 牛客集训 湖南省赛E题 Grid 动态开点线段树
国庆牛客集训的题,正好准备好好训练线段树,想起来就补一下. 题意很简单,两种操作行合并或者列合并,每个操作后计算有多少个子块. 这题应该先推导公式,行操作或者列操作只有一种的时候,很简单,总数就是n* ...
- kibana的query string syntax 笔记
kibana的query string syntax 并不是 Query String Query,只能说类似.kibana的 Lucene query string syntax(es的query ...
- HUE Oozie : error=2, No such file or directory采坑记录
HUE Oozie : error=2, No such file or directory采坑记录 1.错误详情 一直都是同一种方式在hue上定义workflow,不知为啥 今天定义的就是不行... ...
- Jmeter+Ant+Jenkins集成抛出异常java.lang.ClassNotFoundException: javax.mail.internet.MimeMessage
一.问题描述 二.解决方法 下载javax.mail.jar插件,并将该插件放到%ANT_HOME%\lib目录下即可解决,下载地址:https://javaee.github.io/javamail ...
- 理解MVVM在react、vue中的使用
理解MVVM在react.vue中的使用 一:什么是MVC.为什么不用MVC 1:MVC的含义: M(modal):是应用程序中处理数据逻辑的部分. V (view) :是应用程序中数据显示的部分. ...
- .Net Core 使用 NPOI 导入Excel
由于之前在网上查阅一些资料发现总是不能编译通过,不能正常使用,现把能正常使用的代码贴出: /// <summary> /// Excel导入帮助类 /// </summary> ...