Vue CLI、uniapp项目外部js库的导入方式

前端项目有时候需要使用像jquery、corejs等开源库。本文将介绍普通的cli项目和uniapp项目如何导入这些库，以及如何使用。以jquery为例。

一、VueCLI项目

将jquery库放到public文件夹下，在index.html文件里面使用<script>引入

1.导入

2.使用演示
在helloWorld.vue里面打印出window对象以及通过jquery获取DOM

从上图日志可以看到，jquery以及被挂载到window上，可以在项目中直接使用 $

二、uniapp项目

uniapp官方文档上面有介绍如何导入第三方js，只是具体步骤不够明确。
官方介绍
下面我将详细介绍一下具体的操作步骤：
1.在根目录下新建index.html文件，将官网里面的index.html代码拷到文件里。

2.manifest.json的h5配置里，index.html模板路径设置为 index.html，这一步很关键

3.将jquery文件放置到static文件夹下，不能放到其他地方。
官方对static文件夹的解释是：编译到任意平台时，static 目录下的文件均会被完整打包进去，且不会编译。跟Vue CLI项目的public目录差不多。
放置完后index.html里面使用<script>引入，这一步跟Vue CLI项目一样。

4.使用演示

如上图所示，window已经将jquery挂载上去了

通过$ 获取DOM也成功了。