B-Teck!

お仕事からゲームまで幅広く

【TypeScript】CSVをパースする

csv-parseのインストール

$ npm install csv-parse

そのままだとエラーが発生してうまく動かないので対応する。

Warning: Module not found: Error: Can't resolve 'stream' の対応

$ npm i stream-browserify
"paths": {
  "stream": [
    "./node_modules/stream-browserify"
  ]
}

polyfills.tsの修正

この状態でビルドすると下記のようなエラーがいくつか出る。

  • Uncaught ReferenceError: global is not defined
  • Uncaught ReferenceError: Buffer is not defined
  • Uncaught ReferenceError: process is not defined
  • ERROR TypeError: process.nextTick is not a function

これらに対応するためにpolyfills.tsの末尾に下記を追加する

(window as any).global = window;
global.Buffer = global.Buffer || require('buffer').Buffer;
(window as any).process = {
    env: { DEBUG: undefined },
    nextTick: function() {
        return null;
    }
};

csv-parseの利用

import {parse} from 'csv-parse';
// readAsTextとかで読み込んだFileをparseの引数にする
// パース結果は `data` ハンドラで取得でき、1レコードごとに処理される
// 下記のコードの場合は1行ずつconsoleに出力される
parse(file).on('data', (data) => {
    console.log(data);
});

参考

[Angular] Angular 12 (Webpack 5)アップデート記念ビルドエラー対処メモ - Qiita Angular6で”global is not defined”が出た時の回避策 | DevelopersIO
javascript - Angular 6 - process is not defined when trying to serve application - Stack Overflow