Question

我有一个需要阅读的javascript文件。我设法使用FileReader将其读取为String，但是我想读取该文件中导出的对象。

这是我文件的外观：

const carsColor = {
    audi: 'blue',
    bmw: 'black',
};

export default carsColor;

将其读取为字符串：

loadFile = async () => {
    try {
        const response = await fetch(PATH_TO_FILE);
        const blob = await response.blob();
        let read = new FileReader();
        read.onload = function() {
            console.log(read.result); // read.result returns the entire file as a string
        };
        read.readAsBinaryString(blob); 
    }
    catch(e) {
        console.log(e);
    }
}

是否可以从文件中获取carsColor对象？

谢谢。

Answer 1

Fetch API不会加载JS模块，而是加载文件。它不会评估您的JavaScript文件。

我将使用捆绑程序作为源代码（例如webpack）。然后，您可以将JavaScript模块与require()一起使用：

// either this
const carColors = require('./carColors');
// or this
import carColors from './carColors';

console.log(carColors.audi);

Answer 2

更改文件以仅返回json并进行解析

文件

{
    audi: 'blue',
    bmw: 'black',
}

加载功能

loadFile = async () => {
    try {
        const response = await fetch(PATH_TO_FILE);
        const blob = await response.blob();
        let read = new FileReader();
        read.onload = function() {
            console.log(JSON.parse(read.result)); 
        };
        read.readAsBinaryString(blob); 
    }
    catch(e) {
        console.log(e);
    }
}

从远程js文件读取导出的变量

2 个答案: