Импорт пользовательской библиотеки Angular с поддержкой Tyepscript

Я создал пользовательскую библиотеку angular / ionic, которую я хотел бы установить и импортировать в другие мои проекты с помощью npm. Я могу сделать это, делая

import {SharedModule} from 'library-name/src';

Однако, когда я оставляю его только в «имя-библиотеки» без src, он жалуется, что не может найти модуль. Это задание tsconfig или задание package.json, чтобы сообщить компилятору машинописного текста, что index.ts в src библиотеки является основным файлом? У меня они оба настроены как

for tsconfig.json
"files":["./src/index.ts"]

and for package.json as
"main":["./src/index.ts"]

Кроме того, оставлять его в «имя-библиотеки / src» для меня не вариант, потому что по какой-то причине я вижу, что ENOENT index.js не является файлом, когда я явно импортирую файл машинописного текста. Супер запутался!


person Anjil Dhamala    schedule 09.07.2018    source источник


Ответы (1)


Скорее всего, ваш пакет нуждается в доработке. Я рекомендую Sinopia Server для размещения ваших внутренних пакетов npm.

https://github.com/rlidwka/sinopia

чтобы запустить его как службу, используйте сценарий init.d, найденный здесь.

https://github.com/ramiel/sinopia-scripts

Расположение файла конфигурации /etc/sinopia/config.yaml

Чтобы создать и опубликовать пакет npm в sinopia, я рекомендую средство запуска задач gulp с изменением этого сценария:

var bump = require('gulp-bump'),
del = require('del'),
exec = require('child_process').exec,
gulp = require('gulp'),
merge = require('merge2'),
typescript = require('gulp-typescript'),
fs = require('fs');

gulp.task('clean', function () {
del(['dist/*']);
});

gulp.task('bump', ['clean'], function () {
gulp.src('./package.json')
    .pipe(bump({
        type: 'patch'
    }))
    .pipe(gulp.dest('./'));
});

gulp.task('bundle', ['bump'], function () {
var tsResult = gulp.src('lib/*.ts')
    .pipe(typescript({
        module: "commonjs",
        target: "es5",
        noImplicitAny: true,
        emitDecoratorMetadata: true,
        experimentalDecorators: true,
        outDir: "dist/",
        rootDir: "lib/",
        sourceMap: true,
        declaration: true,
        moduleResolution: "node",
        removeComments: false,
        "lib": [
            "es2017",
            "es2016.array.include",
            "dom"
          ],
        types: ["jasmine"]
    }));

return merge([
    tsResult.dts.pipe(gulp.dest('dist/')),
    tsResult.js.pipe(gulp.dest('dist/'))
]);
});

gulp.task('copy', ['bundle'], () => {

gulp.src(['README.md'])
    .pipe(gulp.dest('dist/'));
});

gulp.task('package', ['copy'], () => {

const pkgjson = JSON.parse(fs.readFileSync('./package.json', 'utf8'));

delete pkgjson.scripts;

delete pkgjson.devDependencies;

const filepath = './dist/package.json';

fs.writeFileSync(filepath, JSON.stringify(pkgjson, null, 2), 'utf-8');

});

gulp.task('git-add', ['package'], function (cb) {
exec('git add -A', function (err, stdout, stderr) {
    console.log(stdout);
    console.log(stderr);
    cb(err);
});
});


gulp.task('git-commit', ['git-add'], function (cb) {

var package = require('./package.json');

exec('git commit -m "Version ' + package.version + ' release."', function (err, stdout, stderr) {
    console.log(stdout);
    console.log(stderr);
    cb(err);
});
});

gulp.task('git-push', ['git-commit'], function (cb) {

exec('git push', function (err, stdout, stderr) {
    console.log(stdout);
    console.log(stderr);
    cb(err);
});
});

gulp.task('publish', ['git-push'], function (cb) {

exec('npm publish ./dist', function (err, stdout, stderr) {
    console.log(stdout);
    console.log(stderr);
    cb(err);
});
});

Это определяет несколько команд.

Если вы запустите gulp publish, он запустит все команды по порядку: очистит каталог сборки, упакует файлы, зафиксирует, отправит и затем опубликует пакет.

person Kyle Burkett    schedule 09.07.2018
comment
Это фантастическая идея. Я обязательно сделаю это по мере продвижения вперед. Одна вещь, которую я заметил, заключалась в том, что наличие index.ts в основе проекта намного лучше работает для поддержки intellisense машинописного текста вместо внутри / src и указания package.json, что /src/index.ts является основным файлом. - person Anjil Dhamala; 11.07.2018
comment
Эта рекомендация прямо из нашей собственной настройки здесь, в нашей организации, и это действительно красиво. На исправление ошибок уйдет, может быть, день или два, но в конечном итоге это сэкономит так много работы по разработке и обслуживанию! - person Kyle Burkett; 11.07.2018