Создать наборы для комплекта модулей

Я немного удивляюсь, почему у кого-то еще не было этой проблемы, или, может быть, я просто не использую правильные слова для ее описания. Проблема в том, что у меня есть модуль, который я публикую в npm для версий. Один из них может быть загружен через system-js и использован непосредственно из npm, а другая версия представляет собой самореализующийся пакет, который я создаю с помощью system-js-builder.

Давайте предположим, что модуль называется @ company / foo. У меня есть index.ts в корневой папке, который просто экспортирует все из src, где у меня также есть index.ts, куда экспортируются все подмодули. Таким образом, index.ts выглядит следующим образом.

export * from "./src/";

И в своих модулях я хочу использовать это, я могу просто использовать следующее.

import { bar } from "@company/foo";

Пока все просто. Нет, я создаю самовыполняемый пакет из своего индекса и присваиваю ему глобальное имя foo, чтобы я мог вызывать foo.bar(), если я добавлю скрипт на страницу или объединю его с другими. Это также прекрасно работает. Но теперь у меня проблема, что я понятия не имею, как создать наборы для этого пакета. Моя идея заключалась в том, чтобы сделать что-то вроде

declare namespace foo {
    export * from "./src/";
}

который я думал, очень хорошо описывает, что делает комплектация. Но машинопись это не нравится. Я тоже что-то пробовал с модулями, но ничего не работает. Как я могу описать тот факт, что то, что экспортируется из моего ствола src, имеет префикс пространства имен foo?

Надеюсь, понятно, чего я хочу достичь.

2 ответа

Вам нужно добавить два поля в package.json,

  1. main - сообщить загрузчику модуля, чем является точка входа модуля, кроме index.js,
  2. typings - установить файл определения TypeScript для модуля.

Например, если у нас есть модуль @company/foo включая следующие поля в package.json,

{
    "main": "lib/bundle.js",
    "typings": "index.d.ts"
}

Теперь в вашем tsconfig.jsonхочешь иметь moduleResolution задавать:

{
    "moduleResolution": "node"
}

Когда вы импортируете из @company/foo,

import { bar } from '@company/foo';

В вашем index.d.ts, у вас должна быть эта строка для объявления bar:

declare function bar();

TypeScript попытается найти экспортированный символ bar из определения в node_modules/@company/foo/index.d.ts,

Обновить:

Вот полный пример реэкспорта отдельных функций / объектов из другого модуля и экспорта пространства имен. Этот файл должен называться index.d.ts или же main.d.ts и т.д., поэтому он распознается как определение окружения TypeScript.

import * as another from './src/another';
declare namespace hello {
  function bar();

  interface ProgrammerIntf {
    work();
    walk();
    play();
  }

  class Programmer implements ProgrammerIntf {
    work();
    walk();
    play();
  }

  export import world = another.world;
}

export default hello;

Чтобы использовать это пространство имен, в скрипте вызывающего

import hello from '@company/foo';
hello.bar();
hello.world();
let programmer = new hello.Programmer();

Обновление 2:

Я нашел способ сделать это в документации TypeScript, чего раньше не замечал.

Вы можете объявить все свои типы в global сфера, как показано ниже:

import * as another from './src/another';

declare global {
  namespace hello {
    function bar();

    interface ProgrammerIntf {
      work();
      walk();
      play();
    }

    class Programmer implements ProgrammerIntf {
      work();
      walk();
      play();
    }

    export import world = another.world;
  }
}

Затем в скрипте вызывающего абонента просто используйте:

import '@company/foo';
hello.bar();
hello.world();
let programmer = new hello.Programmer();

Конечно, если вы объединяете объявление в начале вашего пакета, вы должны иметь возможность использовать hello напрямую без оператора импорта.

Если я правильно понимаю, вы хотите глобальную переменную foo который имеет все экспортированные члены module,

Вы можете достичь этого, declare var а также typeof,

import * as _foo from './src'
declare var foo: typeof _foo
// implement self-executing logic

После того, как вы импортируете самодельный код, глобальная переменная foo будет доступна для всех файлов в компилируемом проекте.

Для файлов JavaScript они не распознают типизацию, поэтому до тех пор, пока вы реализуете логику, вы можете получить доступ foo,

Другие вопросы по тегам