react-native-react-bridge icon indicating copy to clipboard operation
react-native-react-bridge copied to clipboard

Bundler Error `SyntaxError: Expecting Unicode escape sequence \uXXXX` when trying to use `@react-pdf/renderer`

Open kuasha420 opened this issue 1 year ago • 1 comments

Describe the bug I am trying to use @react-pdf/renderer to create and render a PDF inside Webview. However, import of this package results in the following error.

error: SyntaxError: entry.tsx: Expecting Unicode escape sequence \uXXXX. (12:73703)

  10 | s{throw Error()}catch(r){var t=r.stack.trim().match(/\n( *(at )?)/);YC=t&&t[1]||""}return\`
     |                                                                                           ^
  13 | \`+YC+e}var WC=!1;function KC(e,t){if(!e||WC)return"";WC=!0;

(texts shortened)

More specifically, something screwy is going on near **""}return\`**

To Reproduce

  • Try to run the following that uses @react-pdf/renderer
import {
  Document,
  Page,
  PDFViewer,
  StyleSheet,
  Text,
  View,
} from '@react-pdf/renderer';
import React from 'react';
import { webViewRender } from 'react-native-react-bridge/lib/web';

const TestPDF = () => {
  return (
    <Document>
      <Page size="A4" orientation="landscape" style={styles.page}>
        <View style={styles.header} fixed>
          <View>
            <Text style={styles.headerText}>Hello World</Text>
          </View>
        </View>
      </Page>
    </Document>
  );
};

const styles = StyleSheet.create({
  page: {
    fontSize: 10,
    flexDirection: 'column',
  },

  header: {
    flexDirection: 'row',
    justifyContent: 'space-between',

  },
  headerText: {
    fontSize: 13,
    fontWeight: 700,
  },
});

const Root = () => {
  return (
    <div>
      <PDFViewer>
        <TestPDF />
      </PDFViewer>
    </div>
  );
};

export default webViewRender(<Root />);

Expected behavior Bundling should work and the PDF rendered.

Platform:

  • Version of react-native: 0.75.4
  • Version of this package: 0.12.3
  • OS: Android
  • Running on: Simulator
  • JavaScript engine: Hermes

kuasha420 avatar Oct 18 '24 18:10 kuasha420

After upgrading to RN 0.75.4 and disibling esbuild minification with the customTransformer example. I'm hit with the same error in different place.

  12719 |         }
  12720 |         var isNotLetter = RegExp.prototype.test.bind(
> 12721 |           /\s|(?![\'])[\!-\@\[-\\`\{-\~\u2013-\u203C]/
        |                                    ^
  12722 |         );
  12723 |         function createHTMLVerifier() {
  12724 |           var skip = false;

Looks like escaping needs additional work.

kuasha420 avatar Oct 19 '24 22:10 kuasha420