babel-transform-in-browser
Advanced tools
babel-transform-in-browser - npm Package Compare versions
Comparing version 0.1.0 to 6.4.5
12
index.js
@@ -12,3 +12,13 @@ import * as Babel from 'babel-standalone'; | ||
| // https://github.com/Daniel15/babel-standalone/issues/4 | ||
| const options = { presets: ['es2015', 'react', 'stage-0'] }; | ||
| const options = { | ||
| presets: [ | ||
| 'es2015', | ||
| 'react', | ||
| 'stage-0' | ||
| ], | ||
| plugins: [ | ||
| 'transform-object-assign', | ||
| 'transform-runtime' | ||
| ] | ||
| }; | ||
| const output = Babel.transform(input, options).code; | ||
@@ -15,0 +25,0 @@ const execFn = new Function(output); |
| { | ||
| "name": "babel-transform-in-browser", | ||
| "version": "0.1.0", | ||
| "version": "6.4.5", | ||
| "description": "Transform ES2015 code in browser on the fly with Babel.js", | ||
@@ -10,3 +10,3 @@ "main": "index.js", | ||
| "dependencies": { | ||
| "babel-standalone": "^1.0.0", | ||
| "babel-standalone": "^6.4.4", | ||
| "currentscript": "^1.1.0" | ||
@@ -13,0 +13,0 @@ }, |
@@ -11,7 +11,13 @@ # Babel Transform In Browser | ||
| ``` | ||
| https://cdnjs.cloudflare.com/ajax/libs/babel-transform-in-browser/0.1.0/dist/btib.min.js | ||
| http://labs.voronianski.com/babel-transform-in-browser/0.1.0/btib.min.js | ||
| ``` | ||
| Or check [dist](https://github.com/voronianski/babel-transform-in-browser/tree/master/dist) folder. | ||
| But after PR accept - https://github.com/cdnjs/cdnjs/pull/6677 will be available through CDN: | ||
| ``` | ||
| https://cdnjs.cloudflare.com/ajax/libs/babel-transform-in-browser/0.1.0/btib.min.js | ||
| ``` | ||
| Also check sources at [dist](https://github.com/voronianski/babel-transform-in-browser/tree/master/dist) folder. | ||
| ## Why? | ||
@@ -36,3 +42,3 @@ | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-transform-in-browser/0.1.0/dist/btib.min.js"></script> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-transform-in-browser/0.1.0/btib.min.js"></script> | ||
| <script type="text/es2015"> | ||
@@ -43,3 +49,3 @@ const multiplier = (x) => (y) => x * y; | ||
| console.log(result); | ||
| // 9 | ||
| // 6 | ||
@@ -77,4 +83,38 @@ class Cat { | ||
| This script was created mainly because of the [discussion](https://twitter.com/floydophone/status/680226147213426688) on how hard it is to start hacking on a js project today. Also it is a response to the **[@Vjeux](https://twitter.com/Vjeux)'s challenge (http://blog.vjeux.com/2015/javascript/challenge-best-javascript-setup-for-quick-prototyping.html)**: | ||
| ### Quick React Prototyping | ||
| This script was created mainly because of the [discussion](https://twitter.com/floydophone/status/680226147213426688) on how hard it is to start hacking on a js project today. Also it is a response to the **[@Vjeux](https://twitter.com/Vjeux)'s challenge (http://blog.vjeux.com/2015/javascript/challenge-best-javascript-setup-for-quick-prototyping.html)**. | ||
| Check the [example](https://github.com/voronianski/babel-transform-in-browser/tree/master/example/react.html) below (it's also availbe as _"React Prototyping Playground"_ gist - https://gist.github.com/voronianski/f67f4973687434f474b4): | ||
| ```html | ||
| <!doctype html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>React Quick Prototyping</title> | ||
| </head> | ||
| <body> | ||
| <div id="root"></div> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.6/react.min.js"></script> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.6/react-dom.min.js"></script> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-transform-in-browser/0.1.0/btib.min.js"></script> | ||
| <script type="text/es2015"> | ||
| // Your playground code goes here, e.g.: | ||
| function App ({ title }) { | ||
| return ( | ||
| <div>{title}</div> | ||
| ); | ||
| } | ||
| ReactDOM.render( | ||
| <App title="Hello World" />, | ||
| document.getElementById('root') | ||
| ); | ||
| </script> | ||
| </body> | ||
| </html> | ||
| ``` | ||
| > - No setup: I'm happy to have to setup something initially (dedicated server, apache, php...) but nothing should be required to create a new project. No npm install, react-native init, creating a github project, yo webapp... | ||
@@ -90,7 +130,7 @@ | ||
| - **DONE** | ||
| - **DONE** Send a file in message, copy-paste in pastebin, upload via ftp, etc. | ||
| > - Keeps working: Once online, it should stay there and keep working 6 months later. No npm start to run it, no special port that's going to conflict with my 10 other prototypes... | ||
| - **DONE** | ||
| - **DONE** Bulletproof html file with script inside helps here again. | ||
@@ -103,3 +143,3 @@ > - Not generic: I don't care about it being generic, I will use whatever transforms you decided. Happy to write js without semi-colons and using SASS for my CSS if you checked all the boxes above. | ||
| - **DONE** | ||
| - **DONE** Absolutely. | ||
@@ -106,0 +146,0 @@ ## To Do |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
Improved metrics
- Lines of code
- increased by0.28%
3972
- Number of low quality alerts
- decreased by-50%
1
- Number of lines in readme file
- increased by35.71%
152
Worsened metrics
- Total package byte prevSize
- decreased by-4.6%
5792045
Dependency changes
+ Addedbabel-standalone@6.26.0(transitive)
- Removedbabel-standalone@1.0.0(transitive)
Updatedbabel-standalone@^6.4.4