Pouchdb Angular2 webpack问题

Question

我正在使用 Jasmine 2.5、Webpack 2.2.1 和 karma 1.3.0 对我的 Angular 2 提供程序进行单元测试...

我已经在 ionic 项目中使用了我的提供程序，并使用 ionic app-scripts 构建它，一切正常。

但是，当我尝试使用 angular webpack 进程构建它时，出现了问题

我使用 Pouchdb，它的构造函数翻译错误，发生错误。

未处理的 Promise 拒绝：pouchdb_browser_1.default 不是构造函数；区域：代理区域；任务：Promise.then；值：TypeError：pouchdb_browser_1.default 不是构造函数

如果我构建它，则使用 postbuild 过程代码将 pouchdb_browser_1.default 更改为 pouchdb_browser 工作正常。

很遗憾，我无法更改将在测试期间执行的代码。

请看下面我的webpack.test.js

const helpers = require('./helpers'),
webpack = require('webpack'),
LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin'); `module.exports = {

devtool: 'inline-source-map',



resolve: {
    extensions: ['.ts', '.js'],
    modules: [helpers.root('src'), 'node_modules']
},

module: {
    rules: [{
        enforce: 'pre',
        test: /\.ts$/,
        loader: 'tslint-loader',
        exclude: [helpers.root('node_modules')]
    }, {
        enforce: 'pre',
        test: /\.js$/,
        loader: 'source-map-loader',
        exclude: [
            // these packages have problems with their sourcemaps
            helpers.root('node_modules/rxjs'),
            helpers.root('node_modules/@angular')
        ]
    }, {
        test: /\.ts$/,
        loader: 'awesome-typescript-loader',
        query: {
            // use inline sourcemaps for "karma-remap-coverage" reporter
            sourceMap: false,
            inlineSourceMap: true,
            module: "commonjs",
            removeComments: true
        },
        exclude: [/\.e2e\.ts$/]
    }, {
        enforce: 'post',
        test: /\.(js|ts)$/,
        loader: 'istanbul-instrumenter-loader',
        include: helpers.root('src'),
        exclude: [/\.spec\.ts$/, /\.e2e\.ts$/, /node_modules/]
    }],
},

plugins: [
    // fix the warning in ./~/@angular/core/src/linker/system_js_ng_module_factory_loader.js
    new webpack.ContextReplacementPlugin(
        /angular(\\|\/)core(\\|\/)(esm(\\|\/)src|src)(\\|\/)linker/,
        helpers.root('./src')
    ),

    new LoaderOptionsPlugin({
        debug: true,
        options: {

            /**
             * Static analysis linter for TypeScript advanced options configuration
             * Description: An extensible linter for the TypeScript language.
             *
             * See: https://github.com/wbuchwalter/tslint-loader
             */
            tslint: {
                emitErrors: false,
                failOnHint: false,
                resourcePath: 'src'
            },

        }
    })
]};

有什么想法吗？

谢谢！

Answer 1

听起来像是将 CommonJS 转换为 ES6 模块的问题。你是用推荐的 TypeScript 方式导入 PouchDB 吗，比如这样？

import * as PouchDB from 'pouchdb';