繁体   English   中英

正确构建和导入自定义库

[英]Correctly build and import a custom library

我正在建立我自己的库,这些库在项目之间使用。 为此,我决定创建一个私有NPM软件包@name/package

当我尝试将其导入到我的CRA应用程序中时,就会出现问题。 服务器可以正确编译(在CLI中),但是在访问该页面时,它会提示我Unhandled Rejection (TypeError): Object(...) is not a function错误。 我使用babel使用以下配置进行编译。

Babel配置

{
    presets: ["@babel/env", "@babel/react"]
}

的package.json

{
  "main": "./dist/index.js",
  "module": "./src/index.js",
  "files": [
    "src/**/*",
    "dist/**/*"
  ],
}

SRC / index.js

export { default as mapObject} from "./mapObject";

SRC / mapObject.js

export default function mapObject(object, callback) {
    return Object.keys(object || {}).map(key => callback(key, object[key]));
}

dist / index.js(由babel编译)

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

Object.defineProperty(exports, "mapObject", {
  enumerable: true,
  get: function get() {
    return _mapObject.default;
  }
});

var _mapObject = _interopRequireDefault(require("./mapObject"));

DIST / mapObject.js

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = mapObject;

function mapObject(object, callback) {
  return Object.keys(object || {}).map(function (key) {
    return callback(key, object[key]);
  });
}

导入文件

// Causes error when loading in the browser
import { mapObject } from "@name/package";
import { mapObject } from "@name/package/src";
import { mapObject } from "@name/package/dist";

// Doesn't cause an error
import mapObject from "@name/package/dist/mapObject";
import mapObject from "@name/package/src/mapObject";

我检查了其他多个库,对我而言,构建/导入过程没有任何区别。

所以上面显示的代码实际上是正确的,但在测试它时我搞砸了,因为没有复制新的src和dist文件夹...

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM