1

プロジェクトで imagemin ノード パッケージを使用しようとしています。これは es6 モジュールであり、使用中にエラーが発生します。

Error [ERR_REQUIRE_ESM]: Must use import to load ES Module.package.json の「モジュール」として「タイプ」を使用

ReferenceError: require is not definedpackage.json で「type」を「commonjs」として使用

私のwebpack構成:

export default env => {
    return {
        mode: env.production ? 'production' : 'development',
        entry: {
            main: './src/main.ts',
            worker: './src/worker.ts'
        },
        target: ['node', 'es2019'],
        devtool: env.production ? false : 'inline-source-map',
        watch: !env.production,
        resolve: {
            extensions: ['.ts', '.js'],
            alias: {
                src: _resolve(process.cwd(), './src')
            }
        },
        module: {
            rules: [{
                test: /\.ts$/,
                include: _resolve(process.cwd(), "src"),
                use: 'ts-loader',
                exclude: [/node_modules/, /\.spec\.ts/, /\.e2e-spec\.ts/]
            }],
        },
        externalsPresets: { node: true },
        externals: [nodeExternals()],
        output: {
            filename: '[name].js',
            path: OUTPUT_DIR,
            clean: !!env.production,
            devtoolModuleFilenameTemplate: 'file:///[absolute-resource-path]',
            library: {
                type: 'module'
            }
        },
        optimization: {
            minimize: false, //!!env.production
            mangleExports: true,
            minimizer: [new terserPlugin({
                terserOptions: {
                    output: {
                        comments: false
                    },
                    keep_classnames: true,
                },
                extractComments: false,
            })]
        },
        experiments: {
            outputModule: true
        }
    };
};

私のtsconfig：

{
  "compilerOptions": {
    "module": "ES2020",
    "removeComments": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "allowSyntheticDefaultImports": true,
    "target": "es2019",
    "sourceMap": true,
    "strict": true,
    "baseUrl": ".",
    "esModuleInterop": true,
    "noImplicitAny": true,
    "moduleResolution": "node",
    "outDir": "../bin/server",
    "typeRoots": [
      "node_module/@types",
      "./typings"
    ],
    "types": [
      "node",
      "@types/jest"
    ]
  },
  "exclude": [
    "node_modules"
  ]
}

.ts ファイルの 1 つで imagemin を「インポート」しようとすると、webpack はそれを「require」に変換します。私も使用してみimport()ましたが、どちらも機能しません。githubにレポを作りました

es6 バンドル (推奨) を取得する方法や、commonjs バンドルで imagemin を使用する方法はありますか?

4

2 に答える 2

0

起動スクリプトを変更する

   "start": "node --experimental-modules src/index.mjs "

そしてpackage.jsonに追加

{ 
   ...
   "type": "module",
   ...
}
于 2021-06-21T05:32:32.323 に答える