he utilizado
type="module"mientras declara la etiqueta del script en el archivo HTML. yo también he usado
export default 'object name'en ambos archivos, pero no entiendo el motivo por el cual se produjo este error. Solo quiero acceder al objeto mochila en el archivo script.js y viceversa.
archivo script.js
/** * Create a Backpack object, populate some HTML to display its properties. */ import backpack from "./backpack.js"; const markup = (backpack) => { return ` <div> <h3>${backpack.name}</h3> <ul> <li>Volume: ${backpack.volume}</li> <li>Color: ${backpack.color}</li> <li>Number of pockets: ${backpack.pocketNum}</li> <li>Strap lengths: L: ${backpack.strapLength.left}, R: ${ backpack.strapLength.right } </li> <li>Top lid: ${backpack.lidOpen ? "Open" : "Closed"}</li> </ul> </div> `; }; console.log(backpack); const main = document.createElement("main"); main.innerHTML = markup(backpack); document.body.appendChild(main); export default markup;archivo backpack.js
import markup from "./script.js"; const backpack = { name: "Everyday Backpack", volume: 30, color: "grey", pocketNum: 15, strapLength: { left: 26, right: 26, }, lidOpen: false, toggleLid: function (lidStatus) { this.lidOpen = lidStatus; updateBackpack(`Lid status changed.`); }, newStrapLength: function (lengthLeft, lengthRight) { this.strapLength.left = lengthLeft; this.strapLength.right = lengthRight; updateBackpack(`Strap lengths updated.`); }, }; const updateBackpack = (update) => { let main = document.querySelector("main"); main.innerHTML = markup(backpack); console.info(update); }; export default backpack;