Workaround explorer project not working

When I import the workaround functions to Main.js the program stops working. I cannot figure out why?

From what I remember, you have to import modules from salaryData.js to the workaroundExplorer file and import modules from that file to main.js.
Open the browser’s console and check the error messages: If it logs that a file can’t be found, you probably have an error in your file path. If it logs that anything is undefined or null, you probably imported modules in the wrong file.

How do I open the browser console to check the errors? Would’ve been very helpful when I started the project lol. I was like I can’t check errors and there is no video! :rofl::rofl:

1 Like

I know. Once you took the wrong turn in this project, you can get lost completely.
I think the development tools are preinstalled on almost all browsers now. So right click on any element in your project. I’m not 100% sure which english term will appear: It must be something like ‘inspect’. If you click that, it opens the dev toolbar with the console.

1 Like
      workAroundModule.js

import {getDataByRole, getDataByCompany} from ‘./modules./salaryData.js’;
import salaryData from ‘./modules./salaryData.js’

This is where the problem was. File path was incorrect. I changed it to ‘./salaryData.js’ and everything is working now. Thank you for your help! The inspect window showed the console errors and eventually led me to this solution.
I still feel the correct file path is ‘./modules/salaryData.js’ because salary.js is in the modules folder but for some reason the program won’t run with that file path.

So you found the issue, nice job!
The files workAroundModule.js and salaryData.js are in the same directory. If you import modules to workAroundModule.js from salaryData.js and the path is ./modules./salaryData.js the program will look for the folder /modules in the very same folder.

1 Like

I went through this multiple times today (not restarting, just checking every hint) and around step 6 it was working but displaying $0. Then i continued on and it went back to not displaying anything. In my import calls in main.js to the two files is ‘./modules/filename.js’ (filename just placeholder for the 2 files for brevity). I went through to step 9 and changed the = 0 to reflect the function calls as per the hint. Still nothing. I’ve triple checked my imports and exports per hints and not sure what went south.

I actually got it working except for the extra challenge. I did get the code to display but not the results after using the formatNumber.format(function_and_rest_of_code).

Soo annoying, when I import the utilities.js into main.js the website breaks and only displays “details”.

import {formatNumber} from './modules/utilities.js'

that’s my import, exported it like this:

export {formatNumber};

anyone know why this is the case?

(everything works fine up to this point)

Cheers!
Andy

I am having the exact same problem. Can you give a hint as to where you found the fix? I have gone over this so many times…

Hello, @andy_b.

Try opening your browser’s console, and see what error messages are there.

Hello, @lynda9408018042.

If you’d like to post your relevant code, someone can try to help.

Link to the project for reference.

I’m having issues with this lesson as well. I hit step 8 and the whole program breaks. I try;

import {getAverageSalaryByRole, getAverageSalaryByCompany, getSalaryAtCompany, getIndustryAverageSalary} from './modules/workAroundModule.js';

it doesn’t work and then when I go to inspect the issue it tells me;

Loading module from “https://5e818b7f5ab142a68b73451fd630d89f.cc-propeller.cloud/modules/modules/salaryData.js” was blocked because of a disallowed MIME type (“text/plain”).

and I can’t quite figure out what that means exactly. I’ve tried it in other browsers with the same issue. Disabled my ad blockers, still nothing.

I have found another solution for this.
When i simply add a line in main.js:

import { getRoles, getCompanies } from './modules/salaryData.js';

Chrome dev tools console tells:

Uncaught SyntaxError: Cannot use import statement outside a module

So I just simply edit the html script line:

<script type="module" src="main.js" defer></script>

and now it’s working fine. Hope it will help.