Unclear Dynamic Import Error Messages

Forgive me for dropping the GitHub issue template, but this is a little more philosophical than technical!

I think the dynamic import error messages could be a little clearer in meaning.

https://github.com/zeit/next.js/blob/master/lib/dynamic.js#L21 This error is thrown when you have a { modules: ..., render: ... } object as the first argument, and a { loading: ...} object as the second argument. To me, the phrasing of the error indicates that this is what I should be doing. I think rewording it to say something like “Cannot include options when the first argument is an object that contains modules and render fields” is much clearer in describing what the programmer has done wrong.

https://github.com/zeit/next.js/blob/master/lib/dynamic.js#L16 This could also be rewritten to read “The first argument should contain both module and render fields” or something similar.

I’m happy to submit a patch on this, but wanted to discuss new wording a little bit before doing it 😄

[johhansantana]

I’m getting this error message, how do I fix this?

Here’s my code:

import dynamic from 'next/dynamic'
const RoutesMap = dynamic(import("./components/routesMap"), {
  ssr: false
})

// routesMap
import * as React from 'react'
class RoutesMap extends React.Component {

  render() {
    return (
      <div>
        <p>hello</p>
      </div>
    )
  }
}

export default RoutesMap

I’m using typescript.

[alx]

I had the same issue as @johhansantana and @rohmanhm

I’ve solved it with the “4. With Multiple Modules At Once” example by adding the ssr: false inside the root object:

const HelloBundle = dynamic({
  ssr: false,
  modules: props => {
  ...

https://github.com/zeit/next.js#4-with-multiple-modules-at-once