пользовательский пакет npm с исходниками - PullRequest
Новая
       3

пользовательский пакет npm с исходниками

0 голосов
/ 11 апреля 2020

Справочная информация: Мы использовали множество сборников рассказов для реализации компонентов пользовательского интерфейса. Теперь у нас есть собственный пакет Utils в npm приватном репо. Это выполняется как пакет, поэтому все источники находятся в одном файле. Когда я ищу источники материалов Ui или источники React, все компоненты находятся в разных файлах. Вот почему отладка проще, а также автоматический импорт в VS Code.

Вопрос: Как мне сделать privete npm пакет с исходниками. Чтобы я мог связать его с другими моими проектами?

Для этого мы использовали накопительный пакет: 

import babel from 'rollup-plugin-babel';
import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import pkg from './package.json';
import filesize from 'rollup-plugin-filesize';
import peerDepsExternal from 'rollup-plugin-peer-deps-external';
import { terser } from "rollup-plugin-terser";

const getBabelOptions = ({ useESModules }) => ({
    exclude: 'node_modules/**',
    runtimeHelpers: true,
    plugins: [
        [
            "transform-react-remove-prop-types",
            {
                "mode": "wrap",
                "ignoreFilenames": ["node_modules"]
            }
        ],
        [
            "import",
            {
                "libraryName": "@material-ui/core",
                'libraryDirectory': '', // if your bundler does not support ES modules
                //"libraryDirectory": "esm",
                "camel2DashComponentName": false
            },
            "core"
        ],
        [
            "import",
            {
                "libraryName": "@material-ui/icons",
                'libraryDirectory': '', // if your bundler does not support ES modules
                //"libraryDirectory": "esm",
                "camel2DashComponentName": false
            },
            "icons"
        ],
        ['@babel/transform-runtime', { useESModules }],
    ],
});


const INPUT_FILE_PATH = 'src/index.js';

const extensions = ['.js', '.jsx'];
const excludeAllExternals = id => !id.startsWith('.') && !id.startsWith('/');

const config = [

    // CommonJS (cjs) build
    // - All external packages are not bundled
    {
        input: INPUT_FILE_PATH,
        output: {
            file: pkg.main,
            format: 'cjs'
        },
        external: excludeAllExternals,
        plugins: [
            resolve({ extensions }),
            babel(getBabelOptions({ useESModules: false })),
            commonjs(),
            terser(),
            peerDepsExternal(),
            filesize(),
        ],
    },



    // EcmaScript Module (esm) build
    // - All external packages are not bundled
    {
        input: INPUT_FILE_PATH,
        output: {
            file: pkg.module,
            format: 'esm'
        },
        external: excludeAllExternals,
        plugins: [
            resolve({ extensions }),
            babel(getBabelOptions({ useESModules: true })),
            commonjs(),
            terser(),
            peerDepsExternal(),
            filesize(),
        ],
    },
]

export default config;
...