简体   繁体   中英

<Class> is not a constructor

I am trying to make an NPM package where someone could use my class my intantiating it after they run npm install <package> . As of right now, it works fine in development but after bundling it up through webpack, I install the package using npm, but immediately it bombs out with 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 (main application code in which I used npm install on)

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'
}

I have tried multiple different flavors of exporting the class but I run into the same exception each time. I tried following lots of other SOF questions similar to this one , but no luck. Where am I off?

NOTE The above is example code in an attempt to simplify the problem but will happily provide the github repo of the actual setup.

Assuming this is for a typescript project (by the tags of this question), this seems like configuration issue that needs to be addressed by having correct setup on your package.json and webpack config file .

It would be helpful if you can share what's in your package.json , but I think looking at the npm script hooks and trying to properly linking the hooks with the webpack build cli script would be a good starting point for solving your problem.

I suggest you to make sure:

  1. Webpack build process(or whatever method you use for typescript compilation) is linked with the hook(s) that are triggered after npm install on your local, which is automatically ran when someone installs your package through npm install
  2. The compiled javascript bundle is exposed correctly through your package.json

as minimum, you may need to check if you need to actually compile your typescript sources, depending on if you are only supporting typescript or not.

This is off topic, but do not use webpack unless you really do need to use webpack. Oftentimes it is just enough to use typescript compiler itself if you are writing a npm module.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM