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

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

今天项目进行生产构建时突然就报错了，报错的地方是我引入的第三方库 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';

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

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

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

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

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

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

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

现在前端项目或多或少会用到Git、Typescript、Eslint、Husky、Lint-staged。本文记录一下如何在项目中使用这些工具。 环境要求：

• 已安装git
• 已安装Node和Npm
• npm全局安装typescript和eslint

注意：以下操作命令均在项目目录下执行

在前端项目开发时，本地启动项目可能使用的地址localhost+端口，然后后端给出的api接口可能是外网的地址（例如dev.api.com），前端直接使用可能会存在跨域问题，解决方法有两种：一种是后端直接设置允许跨域，另一种是做反向代理。 前端做反向代理可以使用NGINX，也可以使用webpack-dev-server。使用webpack-dev-server做代理的配置如下：

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://dev.api.com',
        pathRewrite: {'^/api' : ''}
      }
    }
  }
}