如何构建一个 npm 包以便它能够被导入/需要

Question

我已经构建了一个 npm 包并将其发布到 NPM 上。

当我npm install <my-package>然后import MyPackage from "@Acme/MyPackage"; 进入反应我收到以下错误。

找不到模块：无法解析@Acme/MyPackage

这是因为我如何设置我的 sdk 包。 你可以在下面找到我用来构建它的 webpack 配置。

顺便说一句，如果我直接在标题中导入脚本标签，这会起作用，但是如何在没有在标题中专门定义脚本标签的情况下像这样导入它？

webpack.config.js

const path = require('path');
// const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');

module.exports = {
    entry: './src/index.js',
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'my-package.min.js',
        libraryTarget: 'umd',
        library: 'MyPackage'
    },
    devtool: 'source-map',
    resolve: {
        extensions: ['.js'],
    },
    module: {
        rules: [
            {
                test: /\.(js)$/,
                use: 'babel-loader'
            }
        ]
    },
    node: {
        console: false,
        global: true,
        process: true,
        __filename: 'mock',
        __dirname: 'mock',
        Buffer: true,
        setImmediate: true,
        fs: 'empty',
        net: 'empty',
        tls: 'empty'

        // See "Other node core libraries" for additional options.
    },
    plugins: [
        // new UglifyJSPlugin({ sourceMap: true }),
        new CopyWebpackPlugin([
            { from: 'test/index.html', to: '' }
        ]),
    ],
};

Answer 1

似乎import不知道从哪里导入包，但因为它已经在你的node_modules文件夹中，我猜你要么没有index.js文件，要么你没有定义你的主条目文件为您打包。

每个 NPM 包都会寻找一个index.js文件，但如果你想重命名它，你实际上可以在你的package.json定义它

{
  "name": "yourpackage",
  "version": "x.x.x",
  "main": "another-name.min.js",
}