Neighbourhood Party Manager

    library-utils

    3.2.0 • Public • Published

    Набор утилит для компиляции и генерации доков для react компонентов

    npm license travis appveyor greenkeeper

    gulpfile

    Готовый gulpfile со всеми настройками, необходимыми для сборки библиотеки

    Ваш package.json:

    "docs": "gulp --cwd . --gulpfile ./node_modules/library-utils/gulpfile.js docs",
    "compile": "gulp --cwd . --gulpfile ./node_modules/library-utils/gulpfile.js compile",
    

    Для более тонкой настройки используйте gulp-tasks или настройки в package.json.

    gulp-tasks

    Вы можете использовать готовый набор gulp-задач.

    Пример gulpfile вашего проекта:

    const createTasks = require('library-utils/gulp-tasks');
    createTasks('arui-feather');
    

    Таким образом будет создано две задачи:

    • gulp docs - построение документации по компонентам
    • gulp compile - компиляция css/js/ts файлов библиотеки, подготовка к публикации.

    Параметры createTask

    • packageName - обязательный. Имя пакета. Будет использоваться для генерации документации и тайпингов.
    • options - не обязательный. Настройки путей.
      • publishDir - имя папки для публикации, туда будут записываться скомпилированные файлы
      • docsDir - имя папки для документации
      • tsCompiler - компилятор для typescript
      • tsConfigFilename - путь до файла с конфигурацией typescript
      • componentsGlob - glob для файлов js компонентов
      • tsComponentsGlob - glob для файлов ts компонентов
      • jsGlob - glob для всех публикуемых js файлов пакета
      • tsGlob - glob для всех публикуемых ts файлов пакета
      • autoDtsGlob - glob для js файлов, для которых будет создаваться d.ts
      • cssGlob - glob для всех публикуемых css файлов пакета
      • cssCopyGlob - glob для всех копируемых css фалов пакета
      • resourcesGlob - glob для всех ресурсных файлов пакета (картинки, шрифты)
      • publishFilesGlob - glob для всех дополнительных файлов, которые должны попасть в публикацию

    Настройки в package.json

    Так же можно указать нужные свойства из options в ключе library-utils

    Пример package.json вашего проекта:

    {
        "name": "arui-feather",
        "library-utils": {
            "publishDir": ".my-custom-publish-dir",
            "tsCompiler": "my-fork-of-typescript",
        }
    }
    

    componentPackage

    Плагин для создания package.json из всех файлов. Нужен для упрощения импортов. В случае, если ваша библиотека имеет структуру типа

    component-name/
        component-name.js
    

    создание package.json поможет использовать этот компонент как require('library-name/component-name').

    Пример использования:

    const componentPackage = require('library-utils/gulp/component-package');
     
    gulp.src('file.js')
        .pipe(componentPackage())
        .pipe(gulp.dest('dist'));

    В результате в папке dist будет создан файл package.json:

    { "main": "file.js", "typings": "file.d.ts" }

    componentTypings

    Плагин для создания d.ts файлов для react компонентов. Внутри использует библиотеку react-docgen. Поддерживается генерация только из es6+ кода (не будет работать для уже скомпилированного кода).

    Пример использования:

    const componentTypings = require('library-utils/gulp/component-typings');
     
    gulp.src('file.js')
        .pipe(componentTypings('libraryName'))
        .pipe(gulp.dest('dist'));

    В результате в папке dist будет создан файл file.d.ts.

    declare module 'libraryName/file' {
        import * as React from 'react';
        export interface FileProps {
            /**
             * Управление видимостью компонента
             */
            visible?: boolean;
        }
        export default class File extends React.Component<LoaderProps, any>{
        }
    }

    Параметры:

    • libraryName - префикс для названия модулей. В итоговых d.ts файлах имя модуля будет создать из libraryName + '/' + filename.

    componentDocs

    Плагин для создания документации для react компонентов.

    Пример использования:

    const componentDocs = require('library-utils/gulp/component-docs');
     
    gulp.src('file.js')
        .pipe(componentDocs('libraryName'))
        .pipe(gulp.dest('docs'));

    В результате в папке docs будет создан файл README.md, с описанием props и пубичных методов компонента.

    libraryDoc

    Плагин для создания индексного файла документации.

    Пример использования:

    const libraryDoc = require('library-utils/gulp/library-doc');
     
    gulp.src('src/*.js')
        .pipe(libraryDoc('libraryName'))
        .pipe(gulp.dest('docs'));

    Лицензия

    The MIT License (MIT)
    
    Copyright (c) 2017 Alfa Laboratory
    
    Permission is hereby granted, free of charge, to any person obtaining a copy
    of this software and associated documentation files (the "Software"), to deal
    in the Software without restriction, including without limitation the rights
    to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
    copies of the Software, and to permit persons to whom the Software is
    furnished to do so, subject to the following conditions:
    
    The above copyright notice and this permission notice shall be included in
    all copies or substantial portions of the Software.
    
    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
    IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
    FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
    AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
    LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
    OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
    THE SOFTWARE.
    

    Keywords

    none

    Install

    npm i library-utils

    DownloadsWeekly Downloads

    50

    Version

    3.2.0

    License

    MIT

    Unpacked Size

    84 kB

    Total Files

    35

    Last publish

    Collaborators

    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar
    • avatar