Przeglądarka z wymaganiem ("fs")

Question

Próbowałem użyć przeglądarki w pliku, który używa obiektu fs. Kiedy go przeszukuję, połączenie z numerem require('fs') nie zostanie przekształcone ani nie zostanie zmienione i require zwraca {}.

Czy istnieje sposób obejścia tego problemu? Widziałem kilka sugestii na temat stackoverlow i gdzie indziej, ale żaden nie wydaje się być w pełni zrealizowany.

Mam nadzieję, że uda mi się stworzyć aplikację internetową w google z wykorzystaniem przeglądarki internetowej dla klasy, której uczę.

Z góry dziękuję.

Answer 1

Który system plików powinien używać przeglądarka? System plików HTML5 nie jest tak naprawdę porównywalny z tradycyjnym systemem plików. Nie ma dowiązań symbolicznych i jest dostępny asynchronicznie tylko poza Workerami WWW.

Więc odpowiedź brzmi: Napisz warstwę abstrakcji, która może polegać na module fs podczas działania w Node.js i API FS5 HTML5 podczas działania w przeglądarce. Różnice są zbyt duże, aby można je było przetłumaczyć w przeglądarce.

Answer 2

Jeśli chcesz inline zawartości plików z fs.readFileSync() połączeń, można użyć brfs:

var fs = require('fs'); 
var src = fs.readFileSync(__dirname + '/file.txt'); 

wtedy zrobić:

browserify -t brfs main.js > bundle.js 

i src zostanie ustawiony do treści file.txt w czasie kompilacji .

Answer 3

Jeśli chcesz uruchomić system plików z przeglądarką, możesz zainstalować npm.

npm install browserify-fs 

i można uzyskać dostęp do obiektu fs po stronie klienta.
Dzięki

Answer 4

Dla każdego, kto ma Google'a, miałem dużo lepsze szczęście z transformacją stringify.

https://github.com/JohnPostlethwait/stringify

Odpowiedzi tutaj były frustrujące (choć nie niepożądana) Jestem importowanie szablonów jako strun do moich elementów, aby zapisać się na żądania HTTP kupiony przez około templateUrl i trzymać je z plików JavaScript.

Z jakiegoś powodu brfs nie gra ładnie z Babel i ma wiele zastrzeżeń do pracy.

Nie mogłem w ogóle uzyskać browserify-fs.

Jednak po znalezieniu transformacji stringify było to tak proste jak.

import template from '../template.html' 

const definition = { template } 

component.directive('myDirective',() => definition) 

Tłumaczone przez użytkowników ES5:

var template = require('../template.html') 

component.directive('myDirective', function() { 
    return { 
     template: template 
    } 
})