johnpostlethwait / stringify Goto Github PK
View Code? Open in Web Editor NEWBrowserify plugin to require() text files (templates) inside of your client-side JavaScript files.
Home Page: http://johnpostlethwait.github.com/stringify/
Browserify plugin to require() text files (templates) inside of your client-side JavaScript files.
Home Page: http://johnpostlethwait.github.com/stringify/
→ gulp test
[11:14:25] Using gulpfile ~/www/stringify/gulpfile.js
[11:14:25] Starting 'test'...
[11:14:25] Finished 'test' after 22 ms
the "getExtensions" function
when passed no options argument
✓ should have returned a non-empty array
✓ should have returned the correct extensions
when passed an array of file-extensions as an options argument
✓ should have returned a non-empty array
✓ should have returned the correct extensions
when passed an object with an "extensions" array property as an options argument
✓ should have returned a non-empty array
✓ should have returned the correct extensions
the "getMinifierOptions" function
✓ should have returned default configuration for minifier
✓ should have returned overriden configuration for minifier
the "hasStringifiableExtension" function
when the filename has an extension in the array
✓ should have returned "true"
when the filename does not have an extension
✓ should have returned "false"
when the module is required
✓ should return a function
✓ should have a method "registerWithRequire"
when the module called
with no options
✓ should return a factory function named "browserifyTransform"
when the returned function is called with a valid file path
✓ should return a Stream object
with options as first argument
xxxxxxxxxxxxxxxxxxxxxxxxxxx
✓ should return a function named "browserifyTransform"
1) should respond to input with the given options
with a HTML file as first argument
✓ should return a Stream object
2) should respond to input
with an unknown file as first argument
✓ should return a Stream object
✓ should respond without transformation
the "minify" function
✓ should return a function
✓ should have default minifier extensions
✓ should minify html content
✓ should not minify html content because minification is not requested
✓ should not minify html content because extension is not supported
the "registerWithRequire" function
✓ should allow me to require "./file_fixture.txt" as strings
the "stringify" function
✓ should have returned a string
✓ should begin with module.exports = "
✓ should have perserved newline characters
✓ should have escaped the double-quotes
28 passing (20ms)
2 failing
1) when the module called with options as first argument should respond to input with the given options:
TypeError: buf.copy is not a function
at Function.Buffer.concat (buffer.js:237:9)
at Stream.end (/home/alessio/www/stringify/src/stringify.js:200:29)
at _end (/home/alessio/www/stringify/node_modules/through/index.js:65:9)
at Stream.stream.end (/home/alessio/www/stringify/node_modules/through/index.js:74:5)
at next (/home/alessio/www/stringify/test/main.js:17:12)
at write (/home/alessio/www/stringify/test/main.js:19:3)
at Context.<anonymous> (/home/alessio/www/stringify/test/main.js:101:7)
at callFn (/home/alessio/www/stringify/node_modules/gulp-mocha/node_modules/mocha/lib/runnable.js:250:21)
at Test.Runnable.run (/home/alessio/www/stringify/node_modules/gulp-mocha/node_modules/mocha/lib/runnable.js:243:7)
at Runner.runTest (/home/alessio/www/stringify/node_modules/gulp-mocha/node_modules/mocha/lib/runner.js:373:10)
2) when the module called with a HTML file as first argument should respond to input:
TypeError: buf.copy is not a function
at Function.Buffer.concat (buffer.js:237:9)
at Stream.end (/home/alessio/www/stringify/src/stringify.js:200:29)
at _end (/home/alessio/www/stringify/node_modules/through/index.js:65:9)
at Stream.stream.end (/home/alessio/www/stringify/node_modules/through/index.js:74:5)
at next (/home/alessio/www/stringify/test/main.js:17:12)
at write (/home/alessio/www/stringify/test/main.js:19:3)
at Context.<anonymous> (/home/alessio/www/stringify/test/main.js:135:7)
at callFn (/home/alessio/www/stringify/node_modules/gulp-mocha/node_modules/mocha/lib/runnable.js:250:21)
at Test.Runnable.run (/home/alessio/www/stringify/node_modules/gulp-mocha/node_modules/mocha/lib/runnable.js:243:7)
at Runner.runTest (/home/alessio/www/stringify/node_modules/gulp-mocha/node_modules/mocha/lib/runner.js:373:10)
events.js:141
throw er; // Unhandled 'error' event
^
Error: 2 tests failed.
alessio: /home/alessio/www/stringify git:master
→ node -v && npm -v
v5.1.1
3.5.3
I have been exploring several Browserify plugin and have noticed many plugins make use of the https://github.com/benbria/browserify-transform-tools utilities.
Should we consider cleaning up some of the "through2" code and use of browserify-transform-tools?
Am I missing something very basic here ?
from your manual:
var bundle = browserify()
.use(stringify(['.hjs', '.html', '.whatever']))
.addEntry('my_app_main.js');
but this is the message I get when I run nodejs:
TypeError: Object # has no method 'use'
Hello,
I have an error when i watchify:
Error: Cannot find module './htmlparser' from '/home/projects/cloud/node_modules/stringify/node_modules/html-minifier/dist'
Have you got an idea ?
browserify app.js --debug -t [ stringify --minify --minifyOptions [ --customAttrCollapse /ng-class/ ] --extensions [ .html ] ]
Will not work because the customAttrCollapse
option is expected to be a regexp. html-minifier
's command line interface will parse this argument into a regexp, but stringify
does not.
Note that I get the same result with -t [ stringify --minify --minifier [ --options [ --customAttrCollapse /ng-class/ ] ] ]
I modified the source to stop the 'ZERO WIDTH NO-BREAK SPACE' character from appearing at the beginning of all the html. I am using browserify and stringify together.
function stringify(content) {
content = content.replace(/^\uFEFF/, '');
return 'module.exports = ' + JSON.stringify(content) + ';\n';
}
→ nsp check
(+) 1 vulnerabilities found
┌───────────────┬──────────────────────────────────────────────────────────────────┐
│ │ Regular Expression Denial of Service │
├───────────────┼──────────────────────────────────────────────────────────────────┤
│ Name │ uglify-js │
├───────────────┼──────────────────────────────────────────────────────────────────┤
│ Installed │ 2.4.24 │
├───────────────┼──────────────────────────────────────────────────────────────────┤
│ Vulnerable │ <2.6.0 │
├───────────────┼──────────────────────────────────────────────────────────────────┤
│ Patched │ >=2.6.0 │
├───────────────┼──────────────────────────────────────────────────────────────────┤
│ Path │ [email protected] > [email protected] > [email protected] │
├───────────────┼──────────────────────────────────────────────────────────────────┤
│ More Info │ https://nodesecurity.io/advisories/48 │
└───────────────┴──────────────────────────────────────────────────────────────────┘
Hello,
I am sorry to open this as an issue, but I didn't find a forum where this could be posted.
I would like to include stringify in my grunt task.
Is there any way to do that?
Thanks in advance
i use stringify for compile templates very well, but in the compiled file, browserify save the relatives directories with the name, who can change that?
for example:
template: require('../../../template.users.view.html')
browserify generate the colection like this
{"../../../../template.users.view.html":118}
who can remove the './././'???
Sorry if this is the wrong place to put this but having trouble trying to figure out what is going on (it may well be I'm making a mistake)
I'm trying to pass extensions in via the command line like so:
browserify -t [ stringify --extensions ['.hjs', '.html', '.whatever'] ]
But when I do this i get this error:
79: extensions = extensions.map(function (ext) {
^
TypeError: undefined is not a function
It is entirely plausible that I am passing in these options incorrectly but I can't find any documentation on the right way to pass them in via command line. (I have also tried the extensions without the square brackets, without commas and without inverted commas)
file.txt:
ddd"
code:
browserify.transform(stringify(['.txt']));
error:
ParseError: Unterminated string constant
If I remove "
from file.txt
it works..
I changed from gulp to npm-scripts and now --conservativeCollapse option don't work anymore
(maybe the stringify version updated in the process)
This is the command i'm using (in windows) :
browserify --no-bundle-external --transform browserify-ngannotate --transform [ stringify --extensions [.html] --minify [ --collapseWhitespace --preserveLineBreaks --conservativeCollapse --removeComments --removeAttributeQuotes --removeTagWhitespace ] ] --debug --plugin [ minifyify --map app.min.js.map --output app.min.js.map ] app.js --outfile app.min.js
Is it stringify bug or something wrong in my command syntax?
thanks
Sort of unhelpful error message. I am using it in package.json, like this:
"scripts": {
"js": "browserify index.js -x ractive --standalone gauge -o dist/ractive-gauge.js && uglifyjs dist/ractive-gauge.js -o dist/ractive-gauge.min.js"
},
"browserify": {
"transform": [
"stringify", {
"extensions": ".svg"
}
]},
"devDependencies": {
"browserify": "^8.1.3",
"stringify": "^3.1.0",
"uglify-js": "^2.4.16"
},
I get this error:
Error: path must be a string
at .../ractive-gauge/node_modules/browserify/node_modules/module-deps/node_modules/resolve/lib/async.js:16:16
at process._tickCallback (node.js:355:11)
It works fine if I remove text-requires & the transform stuff.
I have a simple js file in.js
:
require('./in.html');
and in.html
:
<h1>Hello World!</h1>
When I run browserify in.js -d -t stringify -o out.js
I get the following error:
<h1>Hello World!</h1>
^
ParseError: Unexpected token
This has something to do with the new Stream2 stuff, since [email protected] works just fine. I've tested this with [email protected] - 13.0.0 with no success.
i use this command to build:
browserify -v --no-bundle-external --t eslintify --t browserify-ngannotate --t imgurify --t [ stringify --extensions [.html] --minify --minifier [ --options [ --lint --compress-path --collapseWhitespace --preserveLineBreaks --conservativeCollapse --removeComments --removeAttributeQuotes --removeTagWhitespace ] ] ] --debug --plugin [ minifyify --map app.min.js.map --output app.min.js.map ] app.js --outfile app.min.js
without --lint its working fine but with it its says:
TypeError: lint.testElement is not a function (while stringify was processing C:\SVN\Java\ts\magnus\manager\mgm-web\src\main\webapp\components\dashboard\dashboard.html) while parsing file: C:\SVN\Java\ts\magnus\manager\mgm-web\src\main\webapp\components\dashboard\dashboard.html
at Object.HTMLParser.start (C:\SVN\Java\ts\magnus\manager\mgm-web\src\main\webapp\node_modules\stringify\node_modules\html-minifier\src\htmlminifier.js:662:16)
at parseStartTag (C:\SVN\Java\ts\magnus\manager\mgm-web\src\main\webapp\node_modules\stringify\node_modules\html-minifier\src\htmlparser.js:384:17)
at String.replace (native)
at new global.HTMLParser (C:\SVN\Java\ts\magnus\manager\mgm-web\src\main\webapp\node_modules\stringify\node_modules\html-minifier\src\htmlparser.js:239:22)
at Object.minify (C:\SVN\Java\ts\magnus\manager\mgm-web\src\main\webapp\node_modules\stringify\node_modules\html-minifier\src\htmlminifier.js:619:5)
at minify (C:\SVN\Java\ts\magnus\manager\mgm-web\src\main\webapp\node_modules\stringify\src\stringify.js:157:27)
at Stream.transformFn (C:\SVN\Java\ts\magnus\manager\mgm-web\src\main\webapp\node_modules\stringify\src\stringify.js:219:24)
at Stream.end (C:\SVN\Java\ts\magnus\manager\mgm-web\src\main\webapp\node_modules\stringify\node_modules\browserify-transform-tools\lib\transformTools.js:108:30)
at _end (C:\SVN\Java\ts\magnus\manager\mgm-web\src\main\webapp\node_modules\stringify\node_modules\browserify-transform-tools\node_modules\through\index.js:65:9)
at Stream.stream.end (C:\SVN\Java\ts\magnus\manager\mgm-web\src\main\webapp\node_modules\stringify\node_modules\browserify-transform-tools\node_modules\through\index.js:74:5)
There is support for using like this:
require('./views/' + someVar + '.tpl.html');
I am getting this error:
Cannot find module './views/article.tpl.html'
it think it would be really cool to be able to do something like
template.html
<h1>Stringify is ${word}</h1>
and then in javascript:
var word = 'Awesome'
$('body').html(require('template.html'))
Has anyone figured out how to do this yet?
If node_modules/abc/file.txt contains the string "123" and I require('abc/file.txt') stringify will create a block like this in the browserify output:
13:[function(require,module,exports){
123
},{}]
instead of something like this:
13:[function(require,module,exports){
module.exports = "123"
},{}]
I'm trying to use this with gulp to require markdown files as strings, but I'm getting this sort of error:
(function (exports, require, module, __filename, __dirname) { ```foo bar baz
^
SyntaxError: Unexpected token ILLEGAL
Hi,
Your lib is exactly what I was looking for but sadly, I can't get it to work.
I think that Browserify is trying to parse my .hbs files like a js file so I get a "ParseError: Unexpected token".
I use it via a node task which does the following:
var entryPath = 'MY_ENTRY_PATH';
var bundlePath = 'MY_BUNDLE_PATH';
browserify({
debug: true,
})
.transform(stringify({
extensions: [ '.hbs' ],
minify: true
}))
.add(entryPath)
.bundle(function(err) {
if (!err) {
console.log('File has been saved.');
}
})
// Write the stream in a real file
.pipe(fs.createWriteStream(bundlePath));
Am I doing something wrong ?
Thanks a lot
If you process a text file which includes both single and double quotes, the result of running through the stringify/require process has escaped quotes in it.
Input:
<div attrib="something containing 'quotes'">
Output
<div attrib="something containing \'quotes\'">
I can see why this happens, but any suggestions on how to fix? Thanks!
NodeSecurity recently started to yell that stringify
has a low level vulnerability because it uses html-minifier
, which depends on cli#v0.11.x
(responsible for the flaw).
This minor security flaw has been patched in cli#v1.x.x
. However, html-minifier
doesn't use cli
anymore starting with v1.5.0
.
Is it possible to update html-minifier
to at least v1.5.0
, and if it doesn't break anything, to v3.5.2
?
Cheers !
Please, see this for details: browserify/browserify#823
I'm using the grunt browserify plugin which shouldnt relaly matter. but I'm adding a transform like this:
configure: (browserify) ->
# transpile coffeescript to javascript
browserify.transform "coffeeify"
# load any static files (template cacheing)!
browserify.transform stringify
extensions: ['.html']
minify: true
minifier:
extensions: ['.html']
options: {}
it works, but it doesnt minify the html. any ideas?
For some reason, I when I require files in ./node_modules
, I get:
events.js:72
throw er; // Unhandled 'error' event
^
SyntaxError: Unexpected token
Root or other directories seem to work fine. Here's my gulpfile.js
:
'use strict';
var gulp = require('gulp');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');
var browserify = require('browserify');
var stringify = require('stringify');
gulp.task('svg', function(){
var bundle = browserify()
.transform(stringify(['.text', '.html', '.svg']))
.add('./svg.js');
return bundle.bundle()
.pipe(source('svg_bundle.js'))
.pipe(buffer())
.pipe(gulp.dest('./'));
});
I'm running gulp svg
to test this.
Here's ./svg.js
:
var svg = require('./test.svg'); //works
var svg2 = require('./node_modules/test.svg'); //breaks
Here's the contents of test.svg
(both):
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM5.5 7.5h2v-2H9v2h2V9H9v2H7.5V9h-2V7.5zM19 19H5L19 5v14zm-2-2v-1.5h-5V17h5z"/></svg>
Here's ls -l
for both of those files:
-rw-r--r-- 1 ubuntu ubuntu 252 Nov 14 09:53 test.svg
-rw-r--r-- 1 ubuntu ubuntu 252 Nov 14 09:53 node_modules/test.svg
Here's the successful output to ./svg_bundle.js
from just ./test.svg
:
(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
var svg = require('./test.svg'); //works
//var svg2 = require('./node_modules/test.svg'); //breaks
},{"./test.svg":2}],2:[function(require,module,exports){
module.exports = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM5.5 7.5h2v-2H9v2h2V9H9v2H7.5V9h-2V7.5zM19 19H5L19 5v14zm-2-2v-1.5h-5V17h5z\"/></svg>";
},{}]},{},[1]);
Anything I'm missing?
Allow people to use minimatch glob matching to stringify files instead of simple extension matching...
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.