highcharts / highcharts-react-native

Other
103 stars 81 forks source link

ios - non-expo - Failed to fetch script or layout - hcsript count not be read #122

Open appjitsu opened 3 years ago

appjitsu commented 3 years ago

image0

metro-config.js

const { getDefaultConfig } = require('metro-config');

module.exports = (async () => {
  const {
    resolver: { sourceExts, assetExts },
  } = await getDefaultConfig();

  return {
    transformer: {
      getTransformOptions: async () => ({
        transform: {
          experimentalImportSupport: false,
          inlineRequires: false,
        },
      }),
    },
    resolver: {
      assetExts: [...assetExts, 'hcscript'],
      sourceExts,
    },
  };
})();

package.json

"@highcharts/highcharts-react-native": "^3.1.2",
"react": "16.13.1",
"react-native": "0.63.3",
"react-native-webview": "^11.0.2",
appjitsu commented 3 years ago

did the fixes mentioned here: https://github.com/highcharts/highcharts-react-native/issues/104

it works, but it would be nice to use bundled assets and not the cdn

musangowope commented 3 years ago

@appjitsu have u have managed to get the chart show in the ios release? if so could you show me spec u have ur package json and in HighchartsReactNative.js. my chart shows in expo but not when the apk has been generated.help would greatly appreciated

Denyllon commented 3 years ago

Hi @musangowope ,

Have you also tried this one by editing the package files: https://github.com/highcharts/highcharts-react-native/issues/104#issuecomment-714195854 ?

Kind regards!

appjitsu commented 3 years ago

I got it working for both the emulator and device with:

setLayout = async () => {
        this.setState({
            layoutHTML: '<html><head><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0" /><style>#container{width:100%;height:100%;top:0;left:0;right:0;bottom:0;position:absolute;user-select:none;-webkit-user-select:none}*{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}</style><script>;const hcUtils={</script></head><body><div id="container"></div></body></html>'
        }) 
    }
musangowope commented 3 years ago

@Denyllon https://github.com/highcharts/highcharts-react-native/issues/104#issuecomment-714195854 actually worked. thanks

sebastianbochan commented 3 years ago

@musangowope can we close the ticket?

appjitsu commented 3 years ago

im having to do this as a hack in addition to the solution in https://github.com/highcharts/highcharts-react-native/issues/104#issuecomment-714195854. if i dont do a setTimeout i still get the error randomly.

setLayout = async () => {
  setTimeout(() =>
    this.setState({
      layoutHTML: '<html><head><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0" /><style>#container{width:100%;height:100%;top:0;left:0;right:0;bottom:0;position:absolute;user-select:none;-webkit-user-select:none}*{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}</style><script>;const hcUtils={</script></head><body><div id="container"></div></body></html>',
    })
  , 150);
};