Question

我用与Webpack捆绑在一起的打字稿编写了一个小型库，并尝试将这个库导入vuetify项目中。

我已经将库文件添加到了vuetify项目的“ src / lib”文件夹中，并通过import语句导入了该文件。

该库的webpack配置文件包含以下内容：

entry: './src/index.ts',
output: {
   path: path.resolve(__dirname, 'dist'),
   filename: 'mylib.js',
   library: 'mylib',
   libraryTarget: 'umd'
}

index.ts文件仅链接到函数实现本身

import { myfunction } from "./myfunction";
import { myfunction2 } from "./myfunction2";

export {
    myfunction,
    myfunction2
}

tsconfig.json看起来像这样

{
  "compilerOptions": {
    "outDir": "./dist/",
    "sourceMap": true,
    "skipLibCheck": true,
    "moduleResolution":"classic",
    "noImplicitAny": true,
    "removeComments": true,
    "preserveConstEnums": true,
    "target": "es5",
    "module": "es2015",
    "declaration": true,
    "esModuleInterop": true
  },
  "include": ["src/**/*"]
}

我想像

一样使用这个库

import { myfunction} from '../libs/mylib'
...
myfunction()

但是这不起作用，我收到未定义myfunction的错误。

它与

一起使用

import { myfunction} from '../libs/mylib'
...
mylib.myfunction()

但这会导致出现错误，即未定义mylib且导入但未使用myfunction。

我已经尝试过如下导入：

import * as mylib from '../libs/mylib'

，但这根本不起作用。还为库项目尝试了不同的libraryTarget值，但没有成功。

我真的不知道这是怎么回事...

最诚挚的问候，

Jochen

在Vue（Tify）项目中导入非NPM库

0 个答案: