Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Buffer is not defined, Platform React JS #266

Open
Hassaan0 opened this issue Nov 8, 2022 · 2 comments
Open

Buffer is not defined, Platform React JS #266

Hassaan0 opened this issue Nov 8, 2022 · 2 comments

Comments

@Hassaan0
Copy link

Hassaan0 commented Nov 8, 2022

Steps to reproduce.

  • run command npm i fluentreports
  • then simply add following data in your file's componentDidMount if using Class Component or useEffect if using Functional Component

Sample Data

 const data = [
        { name: "Elijah", age: 18 },
        { name: "Abraham", age: 22 },
        { name: "Gavin", age: 28 },
      ];
      const rpt = new Report("grocery1.pdf")
        .data(data) // Add our Data
        .pageHeader(["My Grocery List"]) // Add a simple header
        .detail("{{count}} {{unit}} of {{item}}") // Put how we want to print out the data line.
        .render();

I already tried window.buffer and webpack handling given below

  1. Adding plugins section with ProviderPlugin into webpack.config.js:
    module.exports = {
    // ...
    plugins: [
    // Work around for Buffer is undefined:
    // https://github.com/Buffer removed, it cause some trouble webpack/changelog-v5#10
    new webpack.ProvidePlugin({
    Buffer: ['buffer', 'Buffer'],
    }),
    new webpack.ProvidePlugin({
    process: 'process/browser',
    }),
    ]

  2. Also add in resolve.fallback into webpack.config.js :
    resolve: {
    extensions: [ '.ts', '.js' ],
    fallback: {
    "stream": require.resolve("stream-browserify"),
    "buffer": require.resolve("buffer")
    }
    }

@NathanaelA
Copy link
Owner

Hi did you follow the instructions here https://github.com/NathanaelA/fluentreports/tree/master/generator

Specifically creating the browser version of the code base:
browserify fluentReportsBuilder.js -s fluentReports --ignore iconv-lite -o ../generator/fluentReportsBrowser.js

If you are doing server only, then Node provides "Buffer"

@Hassaan0
Copy link
Author

Hi did you follow the instructions here https://github.com/NathanaelA/fluentreports/tree/master/generator

Specifically creating the browser version of the code base: browserify fluentReportsBuilder.js -s fluentReports --ignore iconv-lite -o ../generator/fluentReportsBrowser.js

If you are doing server only, then Node provides "Buffer"

Yeah I tried it again and it works..
but its showing me the GUI .. i want to use code base functionality but i cant figure it out how to use it .. could you please help me out

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants