第三方插件

1. 全局引入

插件必须放在 src/js/plugins/ 目录下,插件才不会被 2 次编译。

src/index.html

<!-- 例如:引入插件的样式,在head标签里 -->
<link href="js/plugins/echarts/echarts.css"></link>

<!-- 例如:引入插件脚本,在body底部 -->
<script src="js/plugins/echarts/echarts.js"></script>

2. 按需动态引入

在需要引入的地方,通过 loader.import 动态引入

loader.define(function (requires, exports, module, global) {
  // 例如:异步导入
  loader.import(
    ["js/plugins/echarts/echarts.css", "js/plugins/echarts/echarts.js"],
    function () {
      // 回调里才能拿到 echarts全局变量
      echarts.init();
    }
  );
});

有些插件,例如高德地图,只支持全局引入。

3. 导入 NPM 模块

1.7.0 以上支持引入 NPM 模块,且默认工程已经加入 vconsole 模块,如果没有,请先执行以下命令。导入的 npm 模块最终是静态编译在脚本中。

执行安装模块命令

# 进入工程
cd bui-demo
# 安装模块
npm i vconsole --save

在需要的地方导入模块

src/index.js

// 导入手机调试模块
import VConsole from "vconsole";
// 初始化手机调试
const vConsole = new VConsole();
Copyright ©2017-2022 easybui.com all right reserved,powered by Gitbook该文件修订时间: 2022-04-25 14:27:24

results matching ""

    No results matching ""