Error: Bad arguments: First argument should be a string, second should be an array of strings

[blazeu]

throws error when building and then exits.

error UNHANDLED REJECTION


  Error: Bad arguments: First argument should be a string, second should be an a  rray of strings
  
  - compare-strings.js:94 Object.findBestMatch
    [cf-catalog]/[string-similarity]/compare-strings.js:94:11
  
  - load-plugins.js:64 
    [cf-catalog]/[gatsby]/dist/bootstrap/load-plugins.js:64:42
  
  - Array.forEach
  
  - load-plugins.js:63 getBadExportsMessage
    [cf-catalog]/[gatsby]/dist/bootstrap/load-plugins.js:63:14
  
  - load-plugins.js:315 
    [cf-catalog]/[gatsby]/dist/bootstrap/load-plugins.js:315:27
  
  - Array.forEach
  
  - load-plugins.js:308 _callee$
    [cf-catalog]/[gatsby]/dist/bootstrap/load-plugins.js:308:33
  
  - index.js:117 _callee$
    [cf-catalog]/[gatsby]/dist/bootstrap/index.js:117:20

Using gatsby v1.9.214

[youfoundron]

uhh, can I see your gatsby-config file?

[blazeu]

const autoprefixer = require('autoprefixer')

module.exports = {
  plugins: [
    `gatsby-plugin-react-next`,
    `gatsby-plugin-react-helmet`,
    {
      resolve: `gatsby-plugin-postcss-sass`,
      options: {
        postCssPlugins: [
          autoprefixer({
            browsers: ['last 2 versions'],
          }),
        ],
        precision: 8,
      },
    },
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `content`,
        path: `${__dirname}/content/`,
      },
    },
    `gatsby-transformer-yaml`,
    `gatsby-transformer-sharp`,
    `gatsby-plugin-sharp`,
    `gatsby-plugin-purify-css`,
  ],
}

There you go, I guess it's gatsby-plugin-postcss-sass that's problematic.

[youfoundron]

@blazeu will take a look this weekend, in the meantime, try putting putting the gatsby-plugin-postcss-sass entry after gatsby-plugin-purfiy-css in the plugins array.

[blazeu]

That did the trick, thanks!

[blazeu]

Reopening because this probably needs some inspection on why it breaks.

[CanRau]

i've got the same, putting it all the way up (above all style, css-in-js e.g. glamor related stuff) solved it

[youfoundron]

@blazeu, @CanRau are your repositories open source? would be helpful in debugging this.

[CanRau]

it's going to be but still under heavy development so I haven't even "played" with your module I just threw it in for later ;-)

[youfoundron]

No problem!

[CanRau]

I you haven't figured it out by then I'll let you know ;)

[Gazler]

You can replicate this issue by updating the example application in this repository to use gatsby: "next"

Haven't had a change to dive too deeply into the issue, but it appears that some functions that aren't supported are being exported by webpack.

Logging out pluginAPIKeys and apis before this line results in:

https://github.com/gatsbyjs/gatsby/blob/0ef17f334f5552fd9c594fda0fe7ec6a032e037a/packages/gatsby/src/bootstrap/load-plugins/validate.js#L11

pluginAPIKeys = [ undefined,
  'writeFile',
  'readFile',
  'readFile',
  'writeFile',
  'onPostBuild',
  'default',
  'default',
  'default' ]

apis =[ 'resolvableExtensions',
  'createPages',
  'createPagesStatefully',
  'sourceNodes',
  'onCreateNode',
  'onCreatePage',
  'setFieldsOnGraphQLNodeType',
  'preprocessSource',
  'generateSideEffects',
  'onCreateBabelConfig',
  'onCreateWebpackConfig',
  'onPreInit',
  'onPreBootstrap',
  'onPostBootstrap',
  'onPreBuild',
  'onPostBuild',
  'onPreExtractQueries' ]

Given that there are 3 default keys in there, I suspect that would be the result from using export default...

The undefined is what causes the specific issue mentioned by the way.

[youfoundron]

Good catch 👍

Fix might be as simple as converting to commonjs style imports / exports in the source or tweaking the webpack config. Will give that a shot and see if it closes out the issue.