Please be aware there is a known issue with images on the Community. We are working to resolve this issue as quickly as possible. We apologize for the inconvenience. If you need urgent help in the meantime, please reach out to technical support or your Threekit representative.

React-Threekit-Single-File-bundle

Comments

7 comments

  • Luis_Locon
    Luis_Locon

    Hello everyone, Im facing an really weird issue.

    My case is this, I am making an application in react. I saw that it is possible to generate a single file bundle using the --compact flag, since in my use case it is preferable to use a singe file from a private CDN to serve all the Threekit + React App javascript.

    The problem I’m having is that in my local development, everything is working correctly, but when I run the yarn build-react command the application renders fine, but the attributes part returns an array with empty values to be selected. Which shows an empty dropdown, this doesn’t happen in my local version.

    Even the attribute id matches the selected ones, but in the production version, the values are empty

    Example of the attributes Object

    // Local Dev enviroment
    {
      attributes: {
        Color: {
          assetType: ’item’,
          blacklist: [],
          defaultValue: { configuration: ’’ },
          disabledValues: [],
          enabled: true,
          hiddenValues: [],
          id: ’757dd8f5-e05c-4301-8726-38220665c3d4’,
          label: ’Color’,
          name: ’Color’,
          type: ’Asset’,
          value: { configuration: ’’ },
          values: [{...}, {..}], // <--- I have two values here
          visible: true,
        },
      },
    }
    
    // Production Bundle
    {
      attributes: {
        Color: {
          assetType: ’item’,
          blacklist: [],
          defaultValue: { configuration: ’’ },
          disabledValues: [],
          enabled: true,
          hiddenValues: [],
          id: ’757dd8f5-e05c-4301-8726-38220665c3d4’,
          label: ’Color’,
          name: ’Color’,
          type: ’Asset’,
          value: { configuration: ’’ },
          values: [], // <--- This is empty
          visible: true,
        },
      },
    }
    
    

    Does anyone have a similar problem?

    0
  • William  Thompson
    William Thompson

    Hey Luis, typically when the attribute values array is empty, the attributes they’re referencing in the catalog are not published. Can you ensure the items you are referencing in your attributes are published?

    If they are published, can you please invite me to your environment? I will investigate for you. wthompson@threekit.com

    0
  • Luis_Locon
    Luis_Locon
     
    Will:

    wthompson@threekit.com

    Hi Will, I think they are published. But I already send you the invite to the enviroment. Thanks for your help

    FYI: Im doing a test, so the unique Item, is herarchy-test that’s why im trying to reach

    0
  • Luis_Locon
    Luis_Locon

    Hi @Will, I was able to solve the problem I was facing. But I have another question, I am trying to embed my application in a Wordpress site, but the redux process shows me an error. I don’t know why, but when the Launch function is initialized, it performs some series of tasks, but what is happening is that when the functions are sent, Threekit is not loaded, so show me some errors in those functions.

    An example of that:

    If I serve the bundle locally all works perfect, but in the site dont

    0
  • Amaan Saeed
    Amaan Saeed

    Hi Luis. This is due to the publishing workflow on the platform. In dev on the React Dev-Kit, unpublished assets are allowed to show up, but in production those are hidden by default. Its likely this default thats causing the issue of the values not showing up.

    If you’d like to allow unpublished assets to work in production as well, you simply have to replace the ThreekitProvider config object in src/index.js to allow for that change.

    src/index.js

    //  Old config object
      const config = Object.assign(
        {},
        process.env.NODE_ENV === ’development’
          ? { publishStage: ’draft’ }
          : undefined
      );
    
    //  New config object
    const config = { publishStage: ’draft’ }
    
    0
  • Amaan Saeed
    Amaan Saeed

    For your second issue - the one related to the redux state - is that only happening in the Wordpress env or also when you build and serve it locally?

    0
  • Luis_Locon
    Luis_Locon
     
    asaeed:

    related

    Hi @asaeed yeah only happens in the Wordpress env. Locally works perfectly

    0

Please sign in to leave a comment.

Powered by Zendesk