VUE项目远程引入js插件

忽胖忽瘦

于 2019-12-02 13:45:59 发布

阅读量864

点赞数

CC 4.0 BY-SA版权

文章标签： vue vue引入远程js vue引入js vue xx is not undefined

本文链接：https://blog.youkuaiyun.com/flyBird3211/article/details/103346989

VUE 专栏收录该内容

17 篇文章

订阅专栏

本文详细介绍如何在Vue CLI 4.x中引入远程JS文件，包括确保JS文件正确导出，通过index.html引入，配置vue.config.js以及在组件中导入，避免控制台异常，实现无缝集成。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

本文使用的是vue-cli 4.x

第一步:
被引入的js应该是通过export default / export 输出的。

第二步:
在index.html中通过‘script标签 ’引入远程文件。

第三步:
修改vue.config.js。vue.config.js文件不默认生成。用到的时候手动创建。创建时不要忘记 const webpack = require(‘webpack’)

module.exports={
    configureWebpack:{
        plugins: [
            ...
            //原代码
        ],
        //此处将引入的js文件定义一下
        externals: {
            demo: 'demo'
        }
    }
}

第四步:引入
虽然不通过第三步和第四步也可以正常使用，但是在控制台会抛出一个异常。不能忍受的可以通过该方法实现”完美“使用。

import demo from 'demo'