Question

我正在尝试制作一个NPM软件包，以便在运行npm install <package>后有人可以使用我的类来实例化我的类。到目前为止，它在开发中工作正常，但是在通过webpack捆绑后，我使用npm安装了该软件包，但立即用TypeError: index_1.MyClass is not a constructor

炸开了

my-class.ts

export class MyClass {
    constructor() {

    }
    method1(): void {
        console.log('im a method!');
    }
}

index.ts

export { MyClass } from './my-class';

main.ts（我在其中使用npm安装的主要应用程序代码）

import { MyClass } from 'npm-package-directory';

const myClass = new MyClass(); // <-- exception thrown
myClass.method1();

webpack.config.js

const CopyWebpackPlugin = require('copy-webpack-plugin');

module.exports = {
    plugins: [
        new CopyWebpackPlugin([
            {
                from: 'package.json',
                to: 'package.json',
                toType: 'file'
            }
        ]),
        new CopyWebpackPlugin([
            {
                from: 'README.md',
                to: 'README.md',
                toType: 'file'
            }
        ])
    ],
    devtool: 'source-map',
    entry: './src/my-class.ts',
    resolve: {
      extensions: [
          '.ts'
      ]
    },
    output: {
        path: __dirname + '/dist',
        filename: '[name].js'
    },
    module: {
        rules: [
            // all files with a `.ts` or `.tsx` extension will be handled by `ts-loader`
            { test: /\.ts?$/, loader: 'ts-loader' }
        ]
    },
    target: 'node'
}

我尝试了多种不同的导出类的方式，但是每次都遇到相同的异常。我尝试了其他许多类似于this one的SOF问题，但是没有运气。我要去哪里？

注意上面是示例代码，旨在简化问题，但很乐意提供实际设置的github存储库。

Answer 1

假设这是一个打字稿项目（通过此问题的标签），这似乎是配置问题，需要通过在package.json和webpack config file上进行正确的设置来解决。

如果您可以共享package.json中的内容，将会很有帮助，但是我认为查看npm script hooks并尝试将钩子与webpack构建cli脚本正确链接将是一个不错的起点解决您的问题。

我建议您确保：

Webpack的构建过程（或您用于打字稿编译的任何方法）与在本地npm install之后触发的钩子链接，当有人通过{{1 }}
已编译的javascript捆绑包通过您的package.json正确公开了

至少，您可能需要检查是否需要实际编译打字稿源，具体取决于您是否仅支持打字稿。

这不是主题，但是除非确实需要使用webpack，否则不要使用webpack。如果您正在编写npm模块，通常只需使用Typescript编译器本身就足够了。

<class>不是构造函数

1 个答案: