Skip to content
This repository has been archived by the owner on Mar 31, 2023. It is now read-only.

Changes for adding babel, removing global JS #163

Merged
merged 2 commits into from
Oct 18, 2017
Merged

Conversation

evanmwillhite
Copy link
Contributor

@evanmwillhite evanmwillhite commented Oct 18, 2017

Add ES6 support (Babel)

Companion PR for Emulsify Gulp's fourkitchens/emulsify-gulp#64

Features:

  • Support ES6 syntax
  • Uses Babel to compile JS to dist directory using component file path (dist/02-molecules/accordion-item/accordion-item.js
  • Uses Sourcemaps for debugging original code in browser
  • Removes global.js file and libraries.yml reference (not used often and too easy to misuse)

To test:

  • Clone a fresh copy of Emulsify
  • composer install
  • Change line 6 in package.json to "emulsify-gulp": "fourkitchens/emulsify-gulp#add-babel",
  • yarn install
  • yarn start
  • Verify start command runs without errors
  • Verify dist files and sourcemaps are created correctly
  • Verify Pattern Lab components with JavaScript work OK

Post-merge

  1. In Emulsify Gulp, merge in feat(babel): Add babel to scripts/styleguide-scripts tasks. emulsify-gulp#64 and merge develop into master and deploy master (also in Emulsify Gulp).
  2. Edit any instructions for Javascript in Drupal to remove references to global.js

@ModulesUnraveled
Copy link
Contributor

@evanmwillhite I'm getting this error on yarn start

yarn start                                                                           11:39:10
yarn start v0.21.3
$ gulp clean && gulp compile && gulp theme
module.js:472
    throw err;
    ^

Error: Cannot find module 'gulp-uglify'
    at Function.Module._resolveFilename (module.js:470:15)
    at Function.Module._load (module.js:418:25)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)
    at module.exports (/Websites/GitProjects/emulsify-pr-review/node_modules/emulsify-gulp/index.js:16:18)
    at /Websites/GitProjects/emulsify-pr-review/gulpfile.js:16:27
    at Object.<anonymous> (/Websites/GitProjects/emulsify-pr-review/gulpfile.js:18:3)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
error Command failed with exit code 1.

@ModulesUnraveled
Copy link
Contributor

I'm also curious about the repercussions of releasing a new emulsify-gulp. Is that being versioned now? Or will the update break backward compatibility for anyone?

@ModulesUnraveled
Copy link
Contributor

I think I know why I'm getting the uglify error. Seeing if I can fix that now. (TL;DR: Used an existing install, so the yarn.lock was already created)

@ModulesUnraveled
Copy link
Contributor

W00t! Works great!

@ModulesUnraveled
Copy link
Contributor

:shipit:

image

Copy link
Contributor

@ModulesUnraveled ModulesUnraveled left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ship it!

@evanmwillhite evanmwillhite merged commit c5b5c74 into develop Oct 18, 2017
@evanmwillhite evanmwillhite deleted the add-babel branch October 18, 2017 18:03
@infiniteluke
Copy link
Contributor

One test step that was missed here was to ensure the source maps work. Luckily they do!

screen_shot_2017-10-18_at_11_11_00_am

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants