前端禾惠

1 个月前更新 |vue, vite, webpack

现在很多项目都使用了第三方UI组件库，如： Element UI 、 Ant Design Vue 、 View UI 、 Vuetify 等等。引入的方式分为 完整引入 和 按需引入 两种方式。

1 个月前更新 |js

正则表达式中的 (?:pattern)、(?=pattern)、(?!pattern)、(?<=pattern) 和 (?<!pattern) ，容易忘记这里做个笔记。

1 个月前更新 |node

最近开了「前端禾惠」微信公众号，准备把博客文章发布到微信公众号中。在公众号中添加图文时发现编辑器是不支持 markdown 语法的。于是找到了墨滴，在墨滴网站输入 markdown 内容，就可以直接复制内容并粘贴到微信公众号（相当于在这里将 markdown 转换成含样式的 HTML）。

1 个月前更新 |eslint

eslint 提示无法解析模块路径问题

原错误信息：Unable to resolve path to module './show'. eslint(import/no-unresolved)

1 个月前更新 |vite

记一次 vue-tsc 引起的错误

今天项目进行生产构建时突然就报错了，报错的地方是我引入的第三方库 ant-design-vue 和 bytemd ，错误大概如下：

node_modules/ant-design-vue/lib/vc-select/Select.d.ts:175:21 - error TS2304: Cannot find name 'EventHandlerNonNull'.
onPopupScroll?: EventHandlerNonNull;

node_modules/bytemd/lib/index.d.ts:1:20 - error TS2307: Cannot find module './editor.svelte' or its corresponding type declarations.
import Editor from './editor.svelte';

1 个月前更新 |npm

npm创建monorepo项目及常用命令

最近刚接触 monorepo ，记录一下目前用到的一些脚本命令。

假设最终需要的项目结构如下：

my_project
│ 
├── node_modules
├── package.json
├── packages
│   ├── a
│   ├── b
│   └── c

注意：下面所有的命令都是在 my_project 目录下执行的。

注意：workspace 是 npm v7.x 新增的功能，所以需要确保你的 npm 版本大于等于 7.0

4 个月前更新 |其它

单个文件中调整eslint规则方法

禁用 ESLint

/* eslint-disable */
var a = 100;
console.log(a);  
/* eslint-enable */

5 个月前更新 |node, webpack

生产环境js错误收集及定位源码位置

现在前端生产环境的代码基本上是压缩的，如果需要知道压缩代码报错对应的源码位置，我们可以通过sourcemap文件去实现。但对于前端而言，如果把sourcemap放出来，差不多相当于把源码暴露出来了。为了解决这个问题，我把sourcemap文件放到服务端，然后将浏览器的报错发送到服务端由服务端根据错误信息去定位源码所在位置。以前用过Sentry，好像是支持的，但我还有一些其他额外的需求，所以我就造了个简易的轮子。