时间戳

首页 > 解决方案 > Quasar项目中如何导入外部js文件

vue.js - Quasar项目中如何导入外部js文件

问题描述

在早期的 javascript 项目中，我们创建了一个名为 kresource.js 的文件，其代码如下

//kresource file, contains some functions
var kresource = (function () {
    function kresource () {
    }
    kresource.getLang = function () {
      console.log('en')    //it's only a sample...
    }
    return kresource
})()

在 html 页面中，我们可以通过kresource.getLang()访问该函数，但在 Quasar vue 页面中，如何导入该文件并访问该函数？

//index.vue file
import kresource from '../js/kresource.js'

[Vue warn]: Error in created hook: "TypeError: _js_kresource_js__WEBPACK_IMPORTED_MODULE_0___default.a.getLang is not a function"

标签： vue.jsquasar

解决方案

它不起作用，因为您需要将该代码用作模块而不是依赖于var全局。

您需要在export文件中添加一个。在文件的末尾，您需要放置：

export default kresource

在您计划使用它的文件中：

import kresource from 'path to the file'

注意：您可以阅读更多关于 JS 中的模块的信息，这样您就可以更好地理解什么是 hapening，并且也可以代替 var use const，因为该变量永远不会重新签名，并且最好保持全局范围更清洁。

推荐阅读