From fc8be9c8fb7dc66f73abacb8c167053cd27a1b60 Mon Sep 17 00:00:00 2001 From: Trevor Buckner Date: Thu, 10 Jun 2021 00:09:29 -0400 Subject: [PATCH] Babel to support ES6 Javascript in older browsers --- .../homebrew/editor/snippetbar/snippetbar.jsx | 3 +- client/homebrew/homebrew.jsx | 2 +- client/homebrew/pages/newPage/newPage.jsx | 1 + package-lock.json | 102 ++++++++++++++++++ package.json | 5 +- scripts/buildHomebrew.js | 6 +- server.js | 3 +- 7 files changed, 114 insertions(+), 8 deletions(-) diff --git a/client/homebrew/editor/snippetbar/snippetbar.jsx b/client/homebrew/editor/snippetbar/snippetbar.jsx index 0d57fdb60..0c054b12b 100644 --- a/client/homebrew/editor/snippetbar/snippetbar.jsx +++ b/client/homebrew/editor/snippetbar/snippetbar.jsx @@ -37,14 +37,13 @@ const Snippetbar = createClass({ }, renderSnippetGroups : function(){ + let snippets = []; if(this.props.view === 'text') { if(this.props.renderer === 'V3') snippets = SnippetsV3; else snippets = SnippetsLegacy; - } else { - snippets = []; } return _.map(snippets, (snippetGroup)=>{ diff --git a/client/homebrew/homebrew.jsx b/client/homebrew/homebrew.jsx index fbb18a0cc..f254009a0 100644 --- a/client/homebrew/homebrew.jsx +++ b/client/homebrew/homebrew.jsx @@ -45,7 +45,7 @@ const Homebrew = createClass({ }/> }/> }/> - }/> + }/> }/> } /> } /> diff --git a/client/homebrew/pages/newPage/newPage.jsx b/client/homebrew/pages/newPage/newPage.jsx index c2e845945..14f14a987 100644 --- a/client/homebrew/pages/newPage/newPage.jsx +++ b/client/homebrew/pages/newPage/newPage.jsx @@ -27,6 +27,7 @@ const NewPage = createClass({ style : dedent` /*=======--- Example CSS styling ---=======*/ /* Any CSS here will apply to your document! */ + .myExampleClass { color: black; }`, diff --git a/package-lock.json b/package-lock.json index 2b8235d1d..aa7ebbadd 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1245,6 +1245,108 @@ "@babel/helper-plugin-utils": "^7.12.13" } }, + "@babel/plugin-transform-runtime": { + "version": "7.14.5", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.14.5.tgz", + "integrity": "sha512-fPMBhh1AV8ZyneiCIA+wYYUH1arzlXR1UMcApjvchDhfKxhy2r2lReJv8uHEyihi4IFIGlr1Pdx7S5fkESDQsg==", + "requires": { + "@babel/helper-module-imports": "^7.14.5", + "@babel/helper-plugin-utils": "^7.14.5", + "babel-plugin-polyfill-corejs2": "^0.2.2", + "babel-plugin-polyfill-corejs3": "^0.2.2", + "babel-plugin-polyfill-regenerator": "^0.2.2", + "semver": "^6.3.0" + }, + "dependencies": { + "@babel/helper-define-polyfill-provider": { + "version": "0.2.3", + "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.2.3.tgz", + "integrity": "sha512-RH3QDAfRMzj7+0Nqu5oqgO5q9mFtQEVvCRsi8qCEfzLR9p2BHfn5FzhSB2oj1fF7I2+DcTORkYaQ6aTR9Cofew==", + "requires": { + "@babel/helper-compilation-targets": "^7.13.0", + "@babel/helper-module-imports": "^7.12.13", + "@babel/helper-plugin-utils": "^7.13.0", + "@babel/traverse": "^7.13.0", + "debug": "^4.1.1", + "lodash.debounce": "^4.0.8", + "resolve": "^1.14.2", + "semver": "^6.1.2" + } + }, + "@babel/helper-module-imports": { + "version": "7.14.5", + "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.14.5.tgz", + "integrity": "sha512-SwrNHu5QWS84XlHwGYPDtCxcA0hrSlL2yhWYLgeOc0w7ccOl2qv4s/nARI0aYZW+bSwAL5CukeXA47B/1NKcnQ==", + "requires": { + "@babel/types": "^7.14.5" + } + }, + "@babel/helper-plugin-utils": { + "version": "7.14.5", + "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.14.5.tgz", + "integrity": "sha512-/37qQCE3K0vvZKwoK4XU/irIJQdIfCJuhU5eKnNxpFDsOkgFaUAwbv+RYw6eYgsC0E4hS7r5KqGULUogqui0fQ==" + }, + "@babel/helper-validator-identifier": { + "version": "7.14.5", + "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.14.5.tgz", + "integrity": "sha512-5lsetuxCLilmVGyiLEfoHBRX8UCFD+1m2x3Rj97WrW3V7H3u4RWRXA4evMjImCsin2J2YT0QaVDGf+z8ondbAg==" + }, + "@babel/types": { + "version": "7.14.5", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.14.5.tgz", + "integrity": "sha512-M/NzBpEL95I5Hh4dwhin5JlE7EzO5PHMAuzjxss3tiOBD46KfQvVedN/3jEPZvdRvtsK2222XfdHogNIttFgcg==", + "requires": { + "@babel/helper-validator-identifier": "^7.14.5", + "to-fast-properties": "^2.0.0" + } + }, + "babel-plugin-polyfill-corejs2": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.2.2.tgz", + "integrity": "sha512-kISrENsJ0z5dNPq5eRvcctITNHYXWOA4DUZRFYCz3jYCcvTb/A546LIddmoGNMVYg2U38OyFeNosQwI9ENTqIQ==", + "requires": { + "@babel/compat-data": "^7.13.11", + "@babel/helper-define-polyfill-provider": "^0.2.2", + "semver": "^6.1.1" + } + }, + "babel-plugin-polyfill-corejs3": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.2.2.tgz", + "integrity": "sha512-l1Cf8PKk12eEk5QP/NQ6TH8A1pee6wWDJ96WjxrMXFLHLOBFzYM4moG80HFgduVhTqAFez4alnZKEhP/bYHg0A==", + "requires": { + "@babel/helper-define-polyfill-provider": "^0.2.2", + "core-js-compat": "^3.9.1" + } + }, + "babel-plugin-polyfill-regenerator": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.2.2.tgz", + "integrity": "sha512-Goy5ghsc21HgPDFtzRkSirpZVW35meGoTmTOb2bxqdl60ghub4xOidgNTHaZfQ2FaxQsKmwvXtOAkcIS4SMBWg==", + "requires": { + "@babel/helper-define-polyfill-provider": "^0.2.2" + } + }, + "debug": { + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz", + "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==", + "requires": { + "ms": "2.1.2" + } + }, + "ms": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", + "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==" + }, + "semver": { + "version": "6.3.0", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", + "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==" + } + } + }, "@babel/plugin-transform-shorthand-properties": { "version": "7.12.13", "resolved": "https://registry.npmjs.org/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.12.13.tgz", diff --git a/package.json b/package.json index ad5037b2b..1ad5ca1b8 100644 --- a/package.json +++ b/package.json @@ -35,12 +35,13 @@ }, "babel": { "presets": [ - "env", - "react" + "@babel/preset-env", + "@babel/preset-react" ] }, "dependencies": { "@babel/core": "^7.14.0", + "@babel/plugin-transform-runtime": "^7.14.5", "@babel/preset-env": "^7.14.0", "@babel/preset-react": "^7.13.13", "body-parser": "^1.19.0", diff --git a/scripts/buildHomebrew.js b/scripts/buildHomebrew.js index d4fa0e086..94afe801b 100644 --- a/scripts/buildHomebrew.js +++ b/scripts/buildHomebrew.js @@ -7,9 +7,13 @@ const isDev = !!process.argv.find((arg)=>arg=='--dev'); const lessTransform = require('vitreum/transforms/less.js'); const assetTransform = require('vitreum/transforms/asset.js'); -//const Meta = require('vitreum/headtags'); +const babel = require('@babel/core'); + +const babelify = async (code)=>(await babel.transformAsync(code, { presets: ['@babel/preset-env', '@babel/preset-react'], plugins: ['@babel/plugin-transform-runtime'] })).code; const transforms = { + '.js' : (code, filename, opts)=>babelify(code), + '.jsx' : (code, filename, opts)=>babelify(code), '.less' : lessTransform, '*' : assetTransform('./build') }; diff --git a/server.js b/server.js index b5ffd7ba2..de5b4ccd4 100644 --- a/server.js +++ b/server.js @@ -35,7 +35,7 @@ const getBrewFromId = asyncHandler(async (id, accessType)=>{ brew.style = dedent` /*=======--- Example CSS styling ---=======*/ /* Any CSS here will apply to your document! */ - + .myExampleClass { color: black; }`; @@ -217,7 +217,6 @@ app.use((req, res)=>{ templateFn('homebrew', title = req.brew ? req.brew.title : '', props) .then((page)=>{ res.send(page); }) .catch((err)=>{ - console.log('TEMPLATE ERROR'); console.log(err); return res.sendStatus(500); });