storefront-foundation / react-storefront

React Storefront - PWA for eCommerce. 100% offline, platform agnostic, headless, Magento 2 supported. Always Open Source, Apache-2.0 license. Join us as contributor (contributors@reactstorefront.io).
https://www.reactstorefront.io
Other
796 stars 190 forks source link

How to disable mock connector code #191

Open rv-nath opened 3 years ago

rv-nath commented 3 years ago

Bug report

Mock connector code executes, even after I comment the connector line in next.config.js.

Describe the bug

After reading the official documentation (as presented here), I commented out the connector line in next.config.js.

const webpack = require('webpack')
const withReactStorefront = require('react-storefront/plugins/withReactStorefront')
require('dotenv').config()

module.exports = withReactStorefront({
  target: 'serverless',
  //connector: 'react-storefront/mock-connector',
  webpack: (config, { buildId, dev, isServer, defaultLoaders, webpack })=> {
    config.plugins.push(
      new webpack.optimize.LimitChunkCountPlugin({
        maxChunks: 1,
      })
    )
    config.module.rules.push({
      test: /\.(png|jpg|gif|svg)$/i,
      use: [
        {
          loader: 'url-loader',
          options: {
            limit: 8192
          }
        }
      ]
    })
    return config
  },
})

To Reproduce

Steps to reproduce the behavior, please provide code snippets or a repository:

  1. Create a new project using storefront template 2.Edit next.config.js by removing the connector line 3.do npm install to download all dependencies
  2. npm start

Expected behavior

The program should successfully compile and the connector API such as /api/session, and /api/routes should not be invoked.

Screenshots

image

Web console logs indicating calls from mock-connector code image

If applicable, add screenshots to help explain your problem.

System information

Additional context

Add any other context about the problem here.

rv-nath commented 3 years ago

On firefox browser, it throws up the error on the screen itself. image

jcuffe commented 3 years ago

I ran into this issue as well. The docs are correct as far as I can tell, but it's hard to understand what they're suggesting. What I did was remove all imports of react-storefront-connector from my code. After you've done that, you can import handlers you've created yourself, or implement your logic directly in each "api page."

I'm importing my handlers so that I can potentially turn my implementation into a connector.

For any maintainers, I think it would be great if this configuration could accept null or undefined values for the connector!

rv-nath commented 3 years ago

OK. I provided a dummy implementation for routes.api by returning an empty json. This solved my problem. However, your approach seems better, as it optimizes by removing unneeded imports.