webpack을 사용하여 UMD 내장 모듈을 가져 오는 중대한 종속성 오류가 발생합니다.

Question

UMD 내보내기를 사용하여 빌드 된 라이브러리에 의존하는 간단한 파일을 작성하려고합니다.

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

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

console.log(tree); 

그것은 잘 컴파일 그러나 웹팩 종속성 오류를 뱉어 :

Hash: 85004e3e1bd3582666f5 Version: webpack 2.3.2 Time: 959ms Asset Size Chunks Chunk Names dist/bundle.js 61.8 kB 0 [emitted] main build/main.d.ts 0 bytes [emitted] [0] ./~/jsonc-parser/lib/main.js 40.1 kB {0} [built] [1] ./~/jsonc-parser/lib 160 bytes {0} [built] [2] ./~/path-browserify/index.js 6.18 kB {0} [built] [3] ./~/process/browser.js 5.3 kB {0} [built] [4] ./src/main.ts 200 bytes {0} [built] [5] ./~/vscode-nls/lib 160 bytes {0} [optional] [built] [6] ./~/vscode-nls/lib/main.js 5.46 kB {0} [built]

WARNING in ./~/jsonc-parser/lib/main.js 3:24-31 Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

WARNING in ./~/vscode-nls/lib/main.js 118:23-44 Critical dependency: the request of a dependency is an expression

ERROR in ./~/vscode-nls/lib/main.js Module not found: Error: Can't resolve 'fs' in '.../webpack-typescript-umd/node_modules/vscode-nls/lib' @ ./~/vscode-nls/lib/main.js 7:9-22 @ ./~/jsonc-parser/lib/main.js @ ./src/main.ts

내가 commonjs 나의 js transpiled 파일을 유지하려면

// 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') 
       } 
      }, 
     ] 
    } 
} 

하지만 난으로 다시 컴파일하지 않고뿐만 아니라 jsonc-parser를 묶음으로 처리 할 commonjs.

오류를 표시하는 a repo on github을 생성했습니다. 다행히도 이것이 당신을 도울 수 있기를 바랍니다.

간단히 npm install && npm run dist으로 오류를 재현 할 수 있습니다.

Answer 1

저도 같은 문제로 실행하고 문제를 해결하는 방법은 두 가지 공유하기를 원해요 : 소비 된 패키지는 jsonc-parser의 1.0.1 version, 당신은 다음을 추가하기 전에처럼 하나 개의 모듈로 구성된 경우

을 당신의 webpack.config.js : 소비 된 패키지는 여러 개의 파일로 구성

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

경우, 하나의 해결 방법으로 umd-compat-loader를 사용할 수 있습니다. webpack.config.js에서 다음 rule 당신의 package.json에 umd-compat-loader 로더를 추가하고 구성합니다

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

제대로 test를 사용하는 방법에 대한 몇 가지 힌트는, here를 찾을 수 있습니다. 마지막으로, 신용은 OP of the workaround으로갑니다.