0

using below script==>
https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.26.0/babel.js
I want to use a common function of custom validation which need to use in multiple component

//present in my Helpers.js
export function myCommonFunc(name) {
    const temp = 'some more operation ';
    return "Hello ==>" +  name  + " ==>" +  temp  + " done"; //define it according to our needs
    }

//multiple components I want to use, one of them is as follow 

import { myFunc } from "Helpers";
const OneContainer ({ }) => {
    myFunc ('Dev')
}

Getting below error

Uncaught ReferenceError: require is not defined

  • Please share all of your code, how you're running this, etc. It's impossible to tell what's not working from what you shared. – SeedyROM Aug 21 '20 at 20:17
  • 2
    I also don't think `return "Hello ==>" + { name } + " ==>" + { temp } + " done";` will return what you expect it to, the `{ name }` bit creates an object that then gets stringified likely as "[object Object]". Maybe you intended to use a string template, or didn't mean to include the brackets. – Drew Reese Aug 21 '20 at 20:20
  • you probably have a require statement at the top of your script, confused with nodejs's commonjs module – some_groceries Aug 21 '20 at 20:20
  • I am getting an error at line import { myFunc } from "Helpers"; Before writing this line , code works perfectly fine If this comment doesn't clear about my question , please let me know – Sanman Chavan Aug 21 '20 at 20:23
  • 1
    `import { myFunc } from "./Helpers";` By doing "Helpers" it will look in node_modules. – Rajender Joshi Aug 21 '20 at 20:26
  • The common function should return me a bool with an error msg like below return {isvalid:false,errorMsg:'props not valid'} to check whether that module is valid or not @DrewReese wanted to ask that whether I could return a plain string or plain object, not React dom element – Sanman Chavan Aug 21 '20 at 20:29
  • I am referring to below StackOverflow question==> https://stackoverflow.com/questions/32888728/correct-way-to-share-functions-between-components-in-react but when I tried one of the answers from above question started getting an error and could not able to move forward – Sanman Chavan Aug 21 '20 at 20:33
  • @RajenderJoshi what approach I should use , simple javascript function which perform some customize logic and states us whether that value is not valid or not.that function I want to use in multiple components – Sanman Chavan Aug 21 '20 at 20:38
  • 1
    I think @RajenderJoshi is onto it, the import is incorrect. It is looking in your node modules versus your "./Helpers" directory in `src`. – Drew Reese Aug 21 '20 at 20:39
  • @DrewReese I have modified the question, it will return a plain string – Sanman Chavan Aug 21 '20 at 21:16
  • That is a separate issue. Try updating the utility function import to be like `import { myFunc } from "./Helpers";` as @RajenderJoshi pointed out such that points to the directory and file that is `Helpers.js`. Note, this *may not* be the correct relative path to your `Helpers.js` utility file. – Drew Reese Aug 21 '20 at 21:39

0 Answers0