vue：引入外部cdn報錯 ‘XXX is not defined’ 及事件處理辦法

原文：https://blog.csdn.net/skyblacktoday/article/details/89703976

框架：vue-cli（vue腳手架）

例：以cdn引入騰訊防水牆為例

前因：在html的head中引入外部cdn鏈接，

 

在vue文件中直接使用，如圖

 

結果：如圖報錯

 

解決辦法：

1. 在index.html中的head中引入，

2.在webpack.base.conf.js中配置

module.exports = {
externals: {
TencentCaptcha: 'TencentCaptcha'
},
....
}
3.在需要使用的vue文件中引入

import TencentCaptcha from 'TencentCaptcha';
使用

let t = new TencentCaptcha(this.$appid, (rsp) => {
console.log(rsp);
t.destroy();
if (rsp.ret === 0) {
...
} else {
}
}, {});
t.show();
關於騰訊防水牆的文檔說明
————————————————
版權聲明：本文為CSDN博主「Mosowe」的原創文章，遵循 CC 4.0 BY-SA 版權協議，轉載請附上原文出處鏈接及本聲明。
原文鏈接：https://blog.csdn.net/skyblacktoday/article/details/89703976