webpack5打包一个TS 库并发布到npm 一条龙实战教程(附模板代码)

本文是一篇关于如何使用webpack5打包一个TypeScript库并发布到npm的详细教程。内容涵盖选择css预处理器、PostCSS、全局CSS、包管理器、配置文件、代码修改、生成dist、声明文件配置以及npm包发布步骤。
摘要由CSDN通过智能技术生成

是否要添加PWA支持?

这里是一个第三发库,不需要支持

选择要使用的css 预处理器

Which of the following CSS solutions do you want to use?

选择css解决方案

我这个库用less

在这里插入图片描述

你会在你的项目中使用CSS样式吗?

Will you be using CSS styles along with LESS in your project?

你会在你的项目中使用CSS样式吗?

会,这里会给你loader处理

是否使用PostCSS

Will you be using PostCSS in your project?

是否使用PostCSS

postcss可以通过插件机制,预处理css,这里选择里使用。

是否要添加全局css

Do you want to extract CSS for every file?

是否要为每个文件提取CSS?

暂时没有,有的配置即可

选择包管理器

Pick a package manager

选择包管理器

用习惯了yarn

在这里插入图片描述

总览配置

最后覆盖下package.json

在这里插入图片描述

四、 webpack 生成配置预览


整体目录:

在这里插入图片描述

自动生成了

  • tsconfig

  • postcss.config

  • webpack.config

重点关注webpack.config

webpack.config

// Generated using webpack-cli https://github.com/webpack/webpack-cli

const path = require(“path”);

const HtmlWebpackPlugin = re

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值