创建兼容浏览器与Node的轻量NPM数据包

问题1：浏览器环境的fs替代方案 #

浏览器出于安全限制，没有和Node.js fs模块功能对等的API，无法在运行时直接读取本地文件（用户手动上传的场景也不适用于NPM包发布）。因此不能依赖运行时读取解析CSV的方式，必须调整思路：在构建阶段就把CSV数据转换成JS常量，打包到最终产物中。

问题2：更简便的静态数据打包方式 #

推荐以下轻量、无冗余的方案，满足浏览器优先、体积最小的要求：

方案1：Parcel内置CSV转换（最简便） #

Parcel支持通过官方转换器直接将CSV导入为JS对象数组，无需额外代码：

1. 安装Parcel的CSV转换器：

   npm install @parcel/transformer-csv --save-dev
   

2. 在index.js中直接导入CSV文件：

   import data from './your-data.csv';
   export { data };
   

3. 正常执行Parcel打包即可，构建阶段CSV会被自动解析为JS对象数组，最终产物直接导出data常量，无任何运行时依赖，兼容浏览器和Node.js，体积极小。

方案2：预构建脚本转换CSV #

若不想依赖Parcel转换器，可写简单Node脚本在构建前完成CSV转JS：

1. 安装轻量CSV解析库d3-dsv（比完整d3体积小很多）：

   npm install d3-dsv --save-dev
   

2. 编写转换脚本convert.js：

   const fs = require('fs');
   const { csvParse } = require('d3-dsv');
   
   const csvText = fs.readFileSync('./your-data.csv', 'utf8');
   const data = csvParse(csvText);
   fs.writeFileSync('./src/generated-data.js', `export const data = ${JSON.stringify(data)};`);
   

3. 在package.json中添加预构建脚本，确保构建前自动执行转换：

   {
     "scripts": {
       "prebuild": "node convert.js",
       "build": "parcel build src/index.js"
     }
   }
   

4. 在index.js中导入生成的文件并导出：

   import { data } from './generated-data.js';
   export { data };
   

方案3：手动转换（数据量小时） #

若CSV数据量极小，直接手动将其转成JS对象数组写在index.js中，无需任何构建工具：

export const data = [
  {a: 1, b: 2},
  {a: 3, b: 4}
  // 补充其他数据行
];

这种方式体积最小，无任何依赖，直接兼容所有环境。

内容的提问来源于stack exchange，提问作者stuwilmur