Как требовать текстовые файлы с браузером?

Я использую браузер (используя браузерное промежуточное ПО), как мне могут потребоваться простые текстовые файлы, например:

var myTmpl = require("myTmpl.txt");

Я проверил плагин stringify для браузера, но код в документации не работает с браузером версии 2.


person haimke    schedule 29.06.2013    source источник


Ответы (3)


require() действительно лучше всего подходит только для кода javascript и файлов json, чтобы поддерживать паритет с узлом и улучшать читаемость вашего кода для посторонних, которые ожидают, что require() будет работать так же, как в узле.

Вместо использования require() для загрузки текстовых файлов рассмотрите возможность использования преобразования brfs. С помощью brfs вы поддерживаете паритет с узлом, вызывая fs.readFileSync(), но вместо синхронного ввода-вывода, как в узле, brfs встраивает содержимое файла в пакет на месте, поэтому

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

становится

var src = "beep boop\n";

в пакетном выходе.

Просто скомпилируйте с -t brfs:

browserify -t brfs main.js > bundle.js

Подробнее о том, почему слишком большая перегрузка require() — плохая идея: http://mattdesl.svbtle.com/browserify-vs-webpack

person substack    schedule 06.07.2013
comment
Это работает до тех пор, пока рассматриваемый модуль является частью дерева пакетов верхнего уровня, то есть НЕ требуется для пакета, установленного с помощью npm install. Но я не уверен, что преобразование браузера работает с пакетами, требуемыми другими установленными пакетами. - person kurttheviking; 11.08.2013
comment
Это сделало работу за меня, вставив код шейдера в виде строк в мой проект three.js. - person Air; 19.05.2014
comment
Я действительно чувствую, что это ужасная реализация, особенно потому, что нельзя просто абстрагироваться от этой функциональности и сделать что-то вроде: function getTemplate(path) { return fs.readFileSync(__dirname + '/' + path, 'utf8'); } - person Tyler Biscoe; 18.10.2014

строчить:

https://github.com/JohnPostlethwait/stringify

Вот пример автора:

var bundle = browserify()
    .transform(stringify(['.hjs', '.html', '.whatever']))
    .add('my_app_main.js');
person Strider    schedule 03.05.2014

Если вы действительно хотите использовать require(), вы можете посмотреть partialify:

my.txt:

Hello, world!

index.js:

alert( require( "my.txt" ) );

Где настроен Browserify:

var partialify = require( "partialify/custom" );
partialify.alsoAllow( "txt" );

bundle.add( "./index.js" );
bundle.transform( partialify );

Теоретически вы получите "Hello, world!" сообщение в браузере.
P.S. Я не пробовал это сам.

Изменить: обратите внимание, что это решение нарушает совместимость с NodeJS — оно работает только в браузерном состоянии, поскольку NodeJS не знает, как требовать .txt файлов.

person Community    schedule 11.04.2014
comment
Это сработало для меня. Просто примечание: если вы делаете это и используете babelify, вам нужно передать белый список расширений для babelify, чтобы он обрабатывал только нужные вам файлы (.js, .jsx и т. д.), а не текстовые файлы или что-то еще. другие типы файлов, которые вам требуются. Вы можете сделать это, передав флаг --extensions для babelify. - person Elliot Winkler; 28.02.2017