To use an npm package in your page code, simply install the package via the Package Manager and import it in your page code (same way as you currently do it on the backend).
Want to learn more about the Package Manager? Read this article and check out this example.
Wow Wow! Good timing too.
Does that mean front-end packages such as https://www.npmjs.com/package/sharethis-reactjs which shows a share this page bar on the side.
It means that available packages as listed here can now be used in your page code and not only in the backend files.
Do note that some packages only work in the backend or in the client. Make sure that you are using the package in the appropriate place.
Some that don’t work in the frontend (as of yesterday):
mailgun-js
request
unirest
Can you describe what doesn’t work?
@avivfa
Note that no one should probably be using the mailgun-js in front end code for security reasons.
I tried using these modules to do some testing of a mail server api.
I discovered I only had to import them to break the page. To verify I had a button that only did a console log that it was clicked.
The following errors occur by merely importing the node.
mailgun-js:
Cannot find module ‘./streams’ in ‘/dynamic-modules/third-party-npm/9dd0378b/WC_BEGIN/iconv-lite/0.4.24/WC_END/iconv-lite/lib/index.js’
require:
There was an error in your script
Error: Cannot find module ‘net’
unirest:
There was an error in your script
Error: Cannot find module ‘string_decoder’
@avivfa Having the same issue using @google-cloud/speech in page code.
Error
Cannot find module ‘request’ in ‘/dynamic-modules/third-party-npm/9dd0378b/WC_BEGIN/retry-request/4.1.1/WC_END/retry-request/index.js’
@sigpoggy your’e seeing these errors because mailgun-js, request and unirest use native nodejs libraries and are not intended to be used from the browser. We will update the error message.
@chris-derrell @google-cloud/speech use native nodejs libraries and is not intended to be used from the browser.
@avivfa it would be great if the documentation listing available modules specified their use case.
Is there any workaround for packages which are not yet listed?
Some packages were rejected in the past as they were intended for front end. Is there some way to fast track such packages to be added now?
(In may case, at this moment, I’d love to be able to work with twilio-chat somehow…)
@experimentnoxx I don’t see a request for that specific package, please send a request and our team will address it.
@avivfa thanks for your quick reply. I just submitted a request again. It’s odd, I’m pretty sure I did this yesterday, might be a problem on Wix’s end. Do you see it now?
@experimentnoxx I do see, our team will address the request. Thanks for updating.
@avivfa Does this also apply for firebase package ? Had been trying to integrate phoneNumber authentication from firebase/auth from the backend. Any help would be much appreciated!
Concretely speaking, had tried these variations with same ModuleLoadError: Error loading web module backend/test.jsw: Cannot find the firebase namespace; be sure to include firebase-app.js before this library.
// non of the IMPORT variations worked...
// import 'firebase'
// import * as firebase from 'firebase/app'
// import 'firebase/auth'
// import * as firebase from 'firebase'
// import 'firebase/app'
// import 'firebase/auth'
// import * as firebase from 'firebase/app'
// import 'firebase/auth'
// non of the REQUIRE variations worked...
// require('firebase');
// var firebase = require('firebase/app')
// require('firebase/auth')
// var firebase = require('firebase');
// require('firebase/app')
// require('firebase/auth')
// var firebase = require('firebase/app')
// require('firebase/auth')
var firebaseConfig = //some JSON from firebase
var app = firebase.initializeApp(firebaseConfig)
...
I do have an HTML element implemented to bypass the current constraints, but it’s still an ‘ugly duck’ solution 
Thanks in advance!
@avivfa Thanks. How long should it take to get an update on that? There’s no mention of it or its status at https://www.wix.com/corvid/npm-modules . Does that mean it’s not being processed?
Hey, @asralsuvilgaa
We are aware of the issue and I am pleased to inform you that our technical team has implemented a fix and we do not expect any further difficulties regarding this matter.
Can you please doublecheck if it works properly on your side and let us know?
Thanks in advance, we await for your reply.
Thanks @anastasiias for the update (and the team for drilling through during this holiday season)!
Per the issue, I’m still getting similar error, where I tried:
Reinstalling the npm package (v7.5.0 Apache-2.0)
Tried importing the full package vs. features I need
//front-end code
import { authStateChanged } from 'backend/test'
$w.onReady(async function () {
let test = await authStateChanged()
console.log(test)
})
//backend/test.jsw
import 'firebase/auth'
var firebaseConfig = //some JSON from firebase
firebase.initializeApp(firebaseConfig)
export async function authStateChanged(){
return await firebase.auth().onAuthStateChanged(user => (user))
}
Please advise if I should be doing anything differently in the New Year
Best Regards,
@avivfa ?
Away?