My Docs
BlogGithubLinkedin
Cheat Sheets
Cheat Sheets
  • πŸ“‹Cheat Sheets
    • Files
    • Terminal Cheat Sheet
    • Flexbox Cheat Sheet
    • Common HTTP status codes Cheat Sheet
    • networking_cheatsheet
    • Regular Expressions Cheat Sheet
    • REGEX units Cheat Sheet
  • bash_cheatsheet
  • Google dork cheatsheet
  • Cheatsheet-v2
  • πŸ•ΈοΈπŸ’» πŸ’» Javascript
    • JavaScript
      • Javascript Python cheatsheet
      • General
        • JavaScript Promise API Cheat Sheet
        • Chai.js
        • Canvas
        • ES6 EXPORTS
        • Asynchronous JavaScript Cheat Sheet
      • React
        • React Cheat Sheet
          • React Component Guide
        • React Patterns:
        • react-examples
        • React.js
          • Bootstrap
        • React.js cheatsheet 2
        • React-router
        • React.js (v0.14)
        • React.js
        • React Patterns:
      • βš–οΈLibraries & Frameworks
        • LOADASH Cheat Sheet
        • sequelize_cheatsheet
        • Sequelize Cheatsheet
      • Node & Express
        • ExpressJS Cheat Sheet
      • CHEATSHEET
      • NPM Cheat Sheet
        • NPM Command Line Cheat Sheet
      • Function Context Cheatsheet
      • js-model
  • πŸ’»CS-Concepts
    • Computer Science Concepts
      • Data Structures
        • The Queue data structure
        • Cheat Sheet for Beginners: JavaScript Data Structures Methods
        • MDN Web Docs Glossary: Definitions of Web-related terms \| MDN
        • Data Structures Cheat Sheet
        • The Tree data structure
        • An Executable Data Structures Cheat Sheet for Interviews
      • networking_cheatsheet
  • Tools
    • πŸ› οΈTools
      • VSCODE Cheat Sheet
      • Emmet
  • πŸ“ΌGuides-Tutorials
    • Tutorials
      • React.js
  • JavaScript Arrays
  • editorconfig
  • AWS CLI
  • ES6 EXPORTS
  • Flynn
  • Github
    • Github
      • Github Cheat Sheet
    • git log
    • GITHUB Cheat Sheet
      • An Executable Data Structures Cheat Sheet for Interviews
      • graphs_cheatsheet
  • General
    • General
  • πŸ‘¨β€πŸ’»πŸ‘¨πŸ’» πŸ‘¨πŸ’» πŸ’» Programming Languages
    • 🐍Python:
      • Python
        • What is Python
      • Regex In Python
    • HTML
  • EC2 API tools
    • MARKDOWN
    • πŸ§˜β™‚ PSQL
      • POSTGRES
      • postgreSQL_cheatsheet
  • ES6 IMPORTS
    • bash_cheatsheet
    • cleancode
    • πŸ”¨Bash
      • Bash Cheat Sheet
      • Learn Bash Scripting: Bash Scripting Cheatsheet
      • Curl
      • Bash Shortcuts Cheat Sheet
      • SSH Cheatsheet
      • Linux
    • CSS
      • CSS
        • CSS Grid
        • cssnext
        • CSS Cheat Sheet
        • CSS Flex Box
        • CSS tricks
        • CSS selectors
        • cssnext
        • CSS background
        • CSS animations
    • Typescript
  • Computer Science Concepts
    • An Executable Data Structures Cheat Sheet for Interviews
    • graphs_cheatsheet
    • networking_cheatsheet
    • Firebase
    • networking_cheatsheet
    • πŸ›Heroku Cheat Sheet
    • Binary Tree
  • πŸ“šDocs
    • Docs
      • editorconfig
      • EC2 API tools
      • Asynchronous JavaScript Cheat Sheet
      • CHEATSHEET (3)
      • js-model
      • Emmet
      • Binary Tree
      • Python
      • Contributor Covenant Code of Conduct
      • networking_cheatsheet
      • Common HTTP status codes Cheat Sheet
      • AWS CLI
      • Linux
      • networking_cheatsheet
      • React Patterns:
      • MDN Web Docs Glossary: Definitions of Web-related terms \| MDN
      • JavaScript Arrays
      • Linux
      • Javascript Python cheatsheet
      • Cheatsheet-v2
      • Binary Tree
      • Heroku Cheat Sheet
      • Asynchronous JavaScript Cheat Sheet
      • Cheatsheet Compilation
      • AWS CLI
      • EC2 API tools
      • Common HTTP status codes Cheat Sheet
      • Firebase
      • The Queue data structure
      • Cheat Sheet for Beginners: JavaScript Data Structures Methods
Powered by GitBook
On this page

Was this helpful?

Edit on GitHub

ES6 IMPORTS

Imports are handled differently in ES6 Modules than in CommonJS. We use import <name> from <file or package> to import in ES6

Importing Named Exports We import Named Exports using curly braces

import { num1, num2, array, obj, add } from './exports';

Also, when we are importing a JavaScript file, Create-React-App will automatically look for the extension. So there is no need to add it.

Importing Default Exports We Import Default Exports by giving a name of our choosing for the default export and then importing it from the file.

// this will import the default variable from the file
import Subtraction from './imports';

Aliases We also have the ability to create aliases on Named Exports.

import { num1 as myNumber1, num2 as myNumber2 } from './exports';

Go to Exports to see how to export.

LINKS

  1. Learning Objectives, (no answers)

  2. Learning Objectives With Answers

  3. Imports CheatSheet

  4. Exports CheatSheet

  5. Imports, Exports One-to-One

PreviouspostgreSQL_cheatsheetNextbash_cheatsheet

Last updated 3 years ago

Was this helpful?