Message Mixer Project

Hi I’m having an issue with this exercise.

When I use
module.exports = MessageMixer
and
const MessageMixer = require("./messageMixer")
everything works fine.

However, if I try to use export default like so:
export default MessageMixer
and
import MessageMixer from "./messageMixer"
I get the following error:

(node:97799) Warning: To load an ES module, set “type”: “module” in the package.json or use the .mjs extension.
(Use node --trace-warnings ... to show where the warning was created)
/Users/tiagobrandao/Codecademy/Projects/LearningJS/MessageMixer/message.js:1
import MessageMixer from “./messageMixer”
^^^^^^

SyntaxError: Cannot use import statement outside a module
at wrapSafe (internal/modules/cjs/loader.js:979:16)
at Module._compile (internal/modules/cjs/loader.js:1027:27)
at Object.Module._extensions…js (internal/modules/cjs/loader.js:1092:10)
at Module.load (internal/modules/cjs/loader.js:928:32)
at Function.Module._load (internal/modules/cjs/loader.js:769:14)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12)
at internal/main/run_main_module.js:17:47

Not sure if this is important but I’m using VSCode.

Can anyone help?
Thanks!

Hi @brandas
do you have a package.json file in your file structure? In order to use modules you have to install a JavaScript package and compile your code. You can read the codecademy instructions here:
https://www.codecademy.com/learn/introduction-to-javascript/modules/learn-javascript-transpilation/cheatsheet

Hi @mirja_t thanks for your reply.

I don’t think I have a package.json in my file structure. The only file I have on my project’s root folder is a .prettierrc file that contains some settings for the VSCode’s Prettier extension but I don’t think this has nothing to do with this.

My file structure for this project is like so:
Projects/LearningJS/MessageMixer
and here I have my messageMixer.js that contains the module I want to export and my message.js which is where I want to import the module into.

Also I’m running my js code directly on VSCode using the Code Runner extension, and not the command line (not sure if this is relevant).

Are you able to guide me through what I have to do? I’m not being able to figure it out from the info on the link you sent me.

Thank you :slight_smile:

You could do this codecademy lesson:
https://www.codecademy.com/courses/introduction-to-javascript/lessons/browser-compatibility-and-transpilation/exercises/browser-compatibility-introduction
It guides you through the installation process. You have to repeat each step (from that step where you have to use the command line) in your VSCode Terminal.

Thank you! Will have a look :slight_smile:

Hi again @mirja_t :slight_smile:

So I went through the lesson and all makes much more sense now.

I just have one final question. Is there any way to use ES6 with VSCode (and in particular with the Code Runner extension) directly, instead of always having to transpile my code?

Thanks!

I don’t exactly know what you mean by transpile? I don’t use VSCode but I know that it has a terminal and you can install node.js. So everything you did online in the codecademy surrounding, all the installation processes with npm, you have to do that in the VSCode command line as well in order to run the compilation (and make the module import work).