typescript - Webpack kullanarak UMD olarak derlenmiş modülü içe aktarmak Kritik Bağımlılık hatalarına yol açıyor

UMD ihracatlarıyla oluşturulmuş bir kütüphaneye bağlı basit bir dosya oluşturmaya çalışıyorum.

// main.ts
import { parseTree } from 'jsonc-parser';

const tree = parseTree('{ "name: "test" }');

console.log(tree);

Derleme sorunsuz gerçekleşiyor, ancak webpack bağımlılık hataları veriyor:

Hash: 85004e3e1bd3582666f5 Sürüm: webpack 2.3.2 Süre: 959ms Varlık Boyut Parçalar Parça İsimleri dist/bundle.js 61.8 kB 0 [yayınlandı] main build/main.d.ts 0 bayt [yayınlandı] [0] ./~/jsonc-parser/lib/main.js 40.1 kB {0} [oluşturuldu] [1] ./~/jsonc-parser/lib 160 bayt {0} [oluşturuldu] [2] ./~/path-browserify/index.js 6.18 kB {0} [oluşturuldu] [3] ./~/process/browser.js 5.3 kB {0} [oluşturuldu] [4] ./src/main.ts 200 bayt {0} [oluşturuldu] [5] ./~/vscode-nls/lib 160 bayt {0} [isteğe bağlı] [oluşturuldu] [6] ./~/vscode-nls/lib/main.js 5.46 kB {0} [oluşturuldu]

UYARI ./~/jsonc-parser/lib/main.js içinde 3:24-31 Kritik bağımlılık: require fonksiyonu, bağımlılıkların statik olarak çıkarılamayacağı bir şekilde kullanılmış

UYARI ./~/vscode-nls/lib/main.js 118:23-44 Kritik bağımlılık: bir bağımlılık isteği bir ifadedir

HATA ./~/vscode-nls/lib/main.js içinde Modül bulunamadı: Hata: '.../webpack-typescript-umd/node_modules/vscode-nls/lib' içinde 'fs' çözümlenemiyor @ ./~/vscode-nls/lib/main.js 7:9-22 @ ./~/jsonc-parser/lib/main.js @ ./src/main.ts

// webpack.config.js
const path = require('path');

module.exports = {
    entry: './src/main.ts',
    output: {
        filename: 'dist/bundle.js'
    },
    resolve: {
        // Add `.ts` and `.tsx` as a resolvable extension.
        extensions: ['.ts', '.tsx', '.js'] // note if using webpack 1 you'd also need a '' in the array as well
    },
    module: {
        loaders: [ // loaders will work with webpack 1 or 2; but will be renamed "rules" in future
            // all files with a `.ts` or `.tsx` extension will be handled by `ts-loader`
            {
                test: /\.tsx?$/,
                loader: 'ts-loader',
                options: {
                    configFileName: path.resolve(__dirname, 'tsconfig.json')
                }
            },
        ]
    }
}

js dönüştürülmüş dosyalarımı commonjs olarak tutmak istiyorum ama jsonc-parser paketini de commonjs olarak yeniden derlemeden paketlemek istiyorum.

Hatanın nasıl oluştuğunu gösteren bir repo oluşturdum. Umarım bu sana yardımcı olur.

Hatanın tekrarlanması için basitçe npm install && npm run dist yapabilirsiniz.

Cevap #1

Aynı sorunla karşılaştım ve problemi geçici olarak çözmenin iki yolunu paylaşmak istedim:

Tüketilen paket, jsonc-parser'ın 1.0.1 sürümünden önce olduğu gibi tek bir modülden oluşuyorsa, webpack.config.js dosyanıza aşağıdakileri ekleyebilirsiniz:

module: {
    rules: [
        // your rules come here. 
    ],
    noParse: /jsonc-parser|other-umd-packages/
},

Tüketilen paket birden fazla dosyadan oluşuyorsa, bunu aşmanın bir yolu olarak umd-compat-loader kullanılabilir. umd-compat-loader yükleyicisini package.json dosyanıza ekleyin ve webpack.config.js dosyasında aşağıdaki rule öğesini yapılandırın:

module: {
    rules: [
        // other rules come here.
        {
            test: /node_modules[\\|/](jsonc-parser|other-umd-packages)/,
            use: { loader: 'umd-compat-loader' }
        }
    ]
},

test öğesini doğru bir şekilde nasıl kullanacağınıza dair bazı ipuçları burada bulunabilir. Son olarak, ama en az değil, çözümün asıl sahibi olan OP'ye kredi verilir.

İlgili makaleler