Как импортировать чистый пакет TypeScript с помощью npm - PullRequest
0 голосов
/ 04 апреля 2019

Я создаю специальный пакет TypeScript, который позволяет пользователям автоматически использовать REST API и преобразовывать полученные JSON-данные в настоящие TypeScript-объекты.Пакет будет использоваться в другом TypeScript-проекте в сочетании с Vue.js.

Я пробовал несколько разных способов скомпилировать и упаковать пакет с помощью Webpack и распространить его через npm.Я могу скомпилировать пакет в JavaScript и сгенерировать index.d.ts, которые все правильно настроены в package.json.Я также могу включить пакет в мой другой проект.При попытке скомпилировать мой проект TypeScript / Vue я всегда получаю ошибку This dependency was not found в результирующих компонентах.

Полное сообщение об ошибке:

This dependency was not found:

* typescript-rest-mapper in ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/ts-loader??ref--12-1!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/sample/SampleDetailsComponent.vue?vue&type=script&lang=ts&, ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_module
s/ts-loader??ref--12-1!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/sample/SampleOverviewComponent.vue?vue&type=script&lang=ts& and 7 others

Это package.jsonи webpack.config.js пакета:

Package.json:

{
  "name": "typescript-rest-mapper",
  "version": "1.0.6",
  "description": "Package that allows you to automagically build services that consume REST API's. Received/send data is automatically converted between real TypeScript-objects and JSON-objects.",
  "main": "dist/index.js",
  "typings": "dist/index.d.ts",
  "scripts": {
    "build": "webpack && dts-bundle --configJson dts-bundle.config.json",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/AbyxBelgium/TypeScriptRestMapper.git"
  },
  "keywords": [
    "service",
    "rest-api",
    "typescript",
    "rest",
    "mapper"
  ],
  "author": "Pieter Verschaffelt",
  "license": "Apache-2.0",
  "bugs": {
    "url": "https://github.com/AbyxBelgium/TypeScriptRestMapper/issues"
  },
  "homepage": "https://github.com/AbyxBelgium/TypeScriptRestMapper#readme",
  "devDependencies": {
    "@babel/core": "^7.4.0",
    "@babel/preset-env": "^7.4.2",
    "babel-loader": "^8.0.5",
    "dts-bundle": "^0.7.3",
    "ts-loader": "^5.3.3",
    "typescript": "^3.3.4000",
    "webpack": "^4.29.6",
    "webpack-cli": "^3.3.0"
  },
  "dependencies": {
    "reflect-metadata": "^0.1.13",
    "axios": "^0.18.0",
    "pluralize": "^7.0.0"
  }
}

webpack.config.js:

const path = require('path');

module.exports = {
    entry: path.join(__dirname, '/src/index.ts'),
    devtool: 'inline-source-map',
    module: {
        rules: [
            {
                test: /\.tsx?$/,
                use: [
                    'ts-loader'
                ],
                exclude: /node_modules/
            }
        ]
    },
    resolve: {
        extensions: ['.tsx', '.ts', '.js']
    },
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, 'dist'),
        library: 'TypeScriptRestMapper',
        libraryTarget: 'umd'
    },
    mode: 'development'
};

В моем другом проекте явключайте файлы, используя, например, import {Service} from "typescript-rest-mapper";.Обратите внимание, что Service определен в src/service/Service.ts в моем пакете.Чтобы экспортировать все различные классы из моего пакета, я создал файл index.ts, в котором указано:

export {Entity} from "./entity/Entity";
export {Service} from "./service/Service";
export {Status} from "./service/Status";
export {Read} from "./decorators/read";
export {ReadArray} from "./decorators/readArray";
export {Store} from "./decorators/store";
export {StoreArray} from "./decorators/storeArray";
export {Update} from "./decorators/update";
export {UpdateArray} from "./decorators/updateArray";

Я попытался изменить экспорт на export * from "./entity/Entity и т. Д. Что можетчто-то пошло не так?

Примечание. Мой пакет с открытым исходным кодом, его можно найти на GitHub: https://github.com/AbyxBelgium/TypeScriptRestMapper

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...