【日常记录】【插件】浏览器上的扩展 Console Importer

文章目录

• • 1. 引言
  • 2. 安装
  • 3. 使用方法
  • 4. 安装jQuery 示例
  • 参考链接

1. 引言

在前端开发中，经常用需要引入各种各样的库，前端如若想了解一下这个库，使用方法无非是下面这几个情况

1. 看官方文档，看官方的示例
2. 自己创建一个html文件，引入对应的cdn地址
3. 在自己对应工程文件夹中，npm/yarn/pnpm 安装这个依赖，然后根据官方文档进行测试

对于一个前端来说，最熟悉的还是控制台，像是一些库都有 umd/esm/iife 格式的打包文件，引入后，都会在window 上定义一个全局变量，如若在控制台引入一个 umd打包格式的文件，进行一些简单的测试就比较简单了

2. 安装

安装方式

谷歌官方插件安装地址

谷歌官方插件安装地址

打开这个谷歌官方插件安装地址，如若是edge浏览器则会自动有这个提示，点击 获取扩展即可

3. 使用方法

打开浏览器控制台

# 1、可以通过 包 的名称来引入
$i('jquery')

# 2、也可以引入特定的版本
$i('jquery@2')


# 3、也可以引入其他的有效脚本URL
$i('https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js')

# 4、也可以引入css
$i('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css')

4. 安装jQuery 示例

然后可以获取一下 JQ 的版本号，验证是否安装成功

参考链接

• Console Importer GitHub