Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Exporting with app.mount should work in browser #650

Open
YerkoPalma opened this issue Mar 25, 2018 · 3 comments
Open

Exporting with app.mount should work in browser #650

YerkoPalma opened this issue Mar 25, 2018 · 3 comments

Comments

@YerkoPalma
Copy link
Member

Expected behavior

module.exports = app.mount('body') should work on the browser, with browsers APIs

Actual behavior

Using fetch ends up in fetch is not defined error which dissappears when I change module.exports = app.mount('body') with app.mount('body')

Steps to reproduce behavior

Run npx create-choo-app some-app and replace the main view with

var html = require('choo/html')

module.exports = view
var readme
function view (state, emit) {
  if (!readme) {
    fetch('../README.md')
    .then(response => response.text())
    .then(text => {
      readme = text
      emit('render')
    })
  }
  return html`
    <body class="sans-serif pa3">
      ${readme || html`<h2>Loading...</h2>`}
    </body>
  `
}

Then run npm start and it will throw something like

ReferenceError: fetch is not defined
    at Choo.view [as _handler] (/home/yerko/Dev/choo-talk/views/main.js:8:5)
    at Choo._prerender (/home/yerko/Dev/choo-talk/node_modules/choo/index.js:235:18)
    at Choo.toString (/home/yerko/Dev/choo-talk/node_modules/choo/index.js:209:19)
    at Object.module.exports.render (/home/yerko/Dev/choo-talk/node_modules/bankai/ssr/choo.js:66:7)
    at ServerRender.render (/home/yerko/Dev/choo-talk/node_modules/bankai/ssr/index.js:28:39)
    at Array.renderApp (/home/yerko/Dev/choo-talk/node_modules/bankai/lib/graph-document.js:54:11)
    at module.exports (/home/yerko/Dev/choo-talk/node_modules/run-waterfall/index.js:24:13)
    at documentifyRoute (/home/yerko/Dev/choo-talk/node_modules/bankai/lib/graph-document.js:47:5)
    at push (/home/yerko/Dev/choo-talk/node_modules/map-limit/index.js:46:5)
    at flush (/home/yerko/Dev/choo-talk/node_modules/map-limit/index.js:32:7)
@goto-bus-stop
Copy link
Member

goto-bus-stop commented Mar 28, 2018

This happens because bankai tries to server render when you do module.exports = app.mount('body'). When server rendering it enters your view function and tries to fetch, but fetch doesn't exist in node.

@goto-bus-stop
Copy link
Member

Hmm maybe in Bankai we can use https://www.npmjs.com/package/globals to check if an error message is for an undefined browser global and show a more helpful message about SSR.

@YerkoPalma
Copy link
Member Author

idk, for me ssr has been a headache since it arrives to bankai. It is not always needed and it is actually breaking very basic stuff.

For now, I just opted for avoid module.exports = app.mount('body') and just mount. Not sure what would be the best option.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants