umi引用第三方插件库(使用百度地图为例)

umi框架是一个插件化的企业级前端应用框架，是很多react开发者的首选，以下记录在使用该框架中碰到的问题。、

在使用中需要引入第三方插件，使用过dva框架的同学肯定第一时间想到了index.html的heade中引用，但是在umi中好像暴露这个文件，所以详读了下api，找打了解决方法。

umi几乎所有的配置项都在.umirc.js（ts为.umirc.ts）文件中，添加第三方插件也不例外，这里使用的是umi的plugins属性（https://umijs.org/zh-CN/config）

然后找到他的插件API（https://umijs.org/zh-CN/plugins/api#addhtmlscripts），发现里面有addHTMLHeadScripts等方法，直接上代哈。

// .umirc.js文件修改plugins属性
export default {
.
.
.
plugins: [
.
.
.
['./plugin.js'],
.
.
.
]
.
.
.
}
// 根目录创建plugin.js文件
export default (api, opts) => {
  // 引用第三方js
  api.addHTMLHeadScript({
    type: 'text/javascript',
    src: 'http://api.map.baidu.com/api?v=2.0&ak=...',
  });
// 引用第三方css
  api.addHTMLLink({
    rel: 'stylesheet',
    type: 'text/css',
    href: 'http://mapopen.bj.bcebos.com/github/BMapGLLib/DrawingManager/src/DrawingManager.min.css',
  });
  // 修改网页图标
  api.addHTMLLink({
    rel: 'shortcut icon',
    type: 'image/x-icon',
    href: '/logo.png',
  });
};

小伙伴如果有疑问可以第一时间评论或留言，看到后也会及时回复的，有帮助的麻烦动动手指点个赞哟