import / export (modules) – Beau teaches JavaScript



The import and export statements allow you to break up your code in different files or modules.

💻 Code: http://codepen.io/beaucarnes/pen/LyPRdm?editors=0010

🔗 Resource: http://exploringjs.com/es6/ch_modules.html

🐦 Beau Carnes on Twitter: https://twitter.com/carnesbeau

⭐JavaScript Tutorials Playlists⭐
▶JavaScript Basics: https://www.youtube.com/playlist?list=PLWKjhJtqVAbk2qRZtWSzCIN38JC_NdhW5
▶Data Structures and Algorithms: https://www.youtube.com/playlist?list=PLWKjhJtqVAbkso-IbgiiP48n-O-JQA9PJ
▶Design Patterns: https://www.youtube.com/playlist?list=PLWKjhJtqVAbnZtkAI3BqcYxKnfWn_C704
▶ES6: https://www.youtube.com/playlist?list=PLWKjhJtqVAbljtmmeS0c-CEl2LdE-eR_F
▶Clean Code: https://www.youtube.com/playlist?list=PLWKjhJtqVAbkK24EaPurzMq0-kw5U9pJh


We’re busy people who learn to code, then practice by building projects for nonprofits. Learn Full-stack JavaScript, build a portfolio, and get great references with our open source community.

Join our community at https://freecodecamp.com
Read great tech articles at https://medium.freecodecamp.com

source

This Post Has 26 Comments

  1. Kernix

    Wouldn't you also have to import sqrt since it is being used in diag?

  2. Confusing video.
    1. in 1:10 you didn't explained if you had to use the word "lib" or if it was a choice.
    2. 1:38 you didn't use the lib.js in the example so we're just seeing random names.

  3. Felipe

    I'm try many times with: "Uncaught SyntaxError: Cannot use import statement outside a module"

  4. alfons tabz

    syntax error: cannot use import statement outside a module

  5. PartimeVillain

    this method gives me error
    SyntaxError: Cannot use import statement outside a module

  6. Zuhair

    A huge thanks and respect for this video. I was confused about import and export and this video is better than 30 min explanation of other videos…. It saved my time

  7. Henry Choy

    Beau teaches javascript. That's good. What if Bean teaches javascript? That would be epic

  8. I Am the Great

    I wish we had these short 3 minute explanations for programming languages, instead of wasting 20 minutes of some random stuff. This was precise, to the point, and i learned what i needed to know.

  9. how can I export a block of html lines say for example the header html block without node js??

  10. eribert marquez

    How can I export all the content of a .js file in other .js file?

  11. import is a ES6 feature, it hasn't been yet implemented in node js. You have to transplile the code. We can use require instead

  12. Gagan Gupta

    Simply awesome and one of the best and crisp explanation of export and imports

  13. Happyoe

    Great tutorial, Thanks. by the way which font are you using ?

  14. Samuel Fullman

    This is great and i upvoted you, no idea why anyone would downvote. But a question: what would this look like transpiled? Can you give a sample of a simple component file that has some imports and the `export default` export? Note, I assume that an import means, resolve where the file mentioned is, and in transpiling, copy that code in the outputted file. Thanks.

  15. Geeky Programmer

    /home/isham993/Desktop/Nodejs/playground.js:1
    (function (exports, require, module, __filename, __dirname) { import add from './hello.js';

    SyntaxError: Unexpected identifier
    at new Script (vm.js:80:7)
    at createScript (vm.js:274:10)
    at Object.runInThisContext (vm.js:326:10)
    at Module._compile (internal/modules/cjs/loader.js:664:28)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:754:12)
    at startup (internal/bootstrap/node.js:283:19)

Leave a Reply