如何获取Typescript + Webpack + Vuejs在我的node_modules / older / lib /目录中找到软件包?

时间:2019-04-24 13:58:40

标签: typescript vue.js es6-modules

我正在尝试将较早的打字稿项目转换为新的vue.js项目的库。较早的软件包已配置为使用./lib/输出到tsconfig.json,并且package.json包括我能想到的所有“这是我的库所在的”选项。 tsc将所有内容编译到旧软件包中的lib/,而npm link用于将软件包连接在一起。

我的问题是,无论尝试什么,我似乎都无法从导入中删除lib/之类的import { baz } from "older/common/thing"而不是import { baz } from "older/lib/common/thing"。我应该忍受吗?还是我还应该为更漂亮的进口做些其他事情?

package.json(部分)

{
    "main": "./lib/index.js",
    "module": "./lib/index.js",
    "types": "./lib/index.d.ts",
}

tsconfig.json

{
  "compilerOptions": {
    "module": "es6",
    "target": "es6",
    "moduleResolution": "node",
    "noImplicitAny": true,
    "noUnusedLocals": true,
    "removeComments": true,
    "preserveConstEnums": true,
    "allowSyntheticDefaultImports": true,
    "importHelpers": true,
    "sourceMap": true,
    "typeRoots": [
      "typings",
      "node_modules/@types"
    ],
    "outDir": "./lib",
    "declaration": true
  },
  "include": [
    "app/source/**/*",
    "test/**/*"
  ],
  "exclude": [
    "node_modules"
  ]
}

1 个答案:

答案 0 :(得分:0)

当使用es6模块和Typescript之上的JavaScript构建系统时,几乎不可能删除多余的/lib/路径。一个StackOverflow答案提到了一些有关该功能被ECMA标准明确拒绝的内容。相反,诸如lodash-es之类的库会生成第二个输出,将所有内容放入包的根目录中,与package.jsontsconfig.json相邻。之所以适合我,是因为我们可能仍然需要为库和应用程序使用不同的构建设置。

我结束了在tsconfig.json中放入第二个package.json./lib/的工作,并刚刚指示tsc../app/source/提取信息源。新程序将npm link更改为库而不是应用程序的程序包名称。

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "declaration": true,
    "sourceMap": true,
    "outDir": "./",
    "rootDir": "../app/source",
    "baseUrl": "./"
  },
  "include": [
    "../app/source/**/*"
  ],
}