Summarize the problem:
When I merge a commit to Gitlab and run a pipeline, there is a script failure when trying to deploy. more specifically: WebpackError: ReferenceError: __WEBPACK_EXTERNAL_MODULE_firebase_app__ is not defined
-The goal of this post is to hopefully get a better understanding of what I am doing wrong here, as I am trying to follow the errors to find the solution on my own, but have not been successful thus far.
-The expected result is that, because the pipeline had previously worked up until this point, that it would continue to do so. The strange part about this pipeline failure is that I did not actually install any packages on the merge that caused the failure. I went ahead and updated packages and some previous errors went away (for instance, there was a failure involving the sharp library that has now gone away) but now firebase app has become the focus.
The only actual error I saw in the output was WebpackError: ReferenceError: __WEBPACK_EXTERNAL_MODULE_firebase_app__ is not defined followed by ERROR: Job failed: exit code 1
Describe what you've tried: as stated before, I initially thought if I just updated all dependencies, this would help get me a better idea of what was going wrong. I thought I was on the right track when I noticed more progress along the pipeline than before, and there was this issue error (node:260) [DEP_WEBPACK_EXTERNALS_FUNCTION_PARAMETERS] DeprecationWarning: The externals-function should be defined like ({context, request}, cb) => { ... } (Use `node --trace-deprecation ...` to show where the warning was created) so I followed the error message's advice and added curly brackets around context, request in my gatsby-node.js file. That error went away on the next pipeline attempt, but WebpackError: ReferenceError: __WEBPACK_EXTERNAL_MODULE_firebase_app__ is not defined remains
Show some code:
I believe the gatsby-node.js file is what is relevant here, so here it is:
exports.onCreateWebpackConfig = ({ stage, actions, getConfig }) => {
if (stage === 'build-html') {
actions.setWebpackConfig({
// Don't bundle modules that reference browser globals such as `window` and `IDBIndex` during SSR.
// See: https://github.com/gatsbyjs/gatsby/issues/17725
externals: getConfig().externals.concat(function ({ _context, request }, callback) {
// Exclude bundling firebase* and react-firebase*
// These are instead required at runtime.
if (/^#?(react-)?firebase(.*)/.test(request)) {
console.log('Excluding bundling of: ' + request);
return callback(null, 'umd ' + request);
}
callback();
}),
});
}
};
I can provide other details if needed, and would appreciate any advice that anyone has to offer. Thanks!
Downgraded Gatsby back to v2 (as well as all the relevant gatsby plugins) and the error went away
I have been experimenting with here maps. When I started the project I was minimising the project code and everything was working as expected.
However, in order to debug the project I stopped minimising the code. Now when loading here maps I get a 404 trying to load:
http://localhost:8082/vendor/here-maps//styles/omv/miami/normal.day.yaml
I have looked back at my code that was working, (when I was minimising the code) and the url was:
https://js.api.here.com/v3/3.1.17.2/styles/omv/miami/normal.day.yaml
Why has the url changed when I stopped minimising the code?
How do I correct the issue?
Thanks in advance.
I think it is here bugs? I only get 3 working, and others when request tile.png get error 404
var here_apiKey = '....'
var appId = 'xxx';
var appCode = '......';
var urlTpl =
'https://{1-4}.{base}.maps.cit.api.here.com' +
'/{type}/2.1/maptile/newest/{scheme}/{z}/{x}/{y}/256/png' +
'?app_id={app_id}&app_code={app_code}' +
'&apiKey={api_key}';
I can get these working :
satellite.day
hybrid.day
terrain.day
But when request tile.png get error 404 on these:
pedestrian.day
normal.day.transit
normal.day
I am developing a Point of sale (POS) for my store. And I am developing a Meteor app that will connect to the POS receipt printer. But as you know you cant simply use window.print().
I read but didnt understand the Meteor documentation about this, and I have several questions about it. (https://guide.meteor.com/mobile.html#using-plugins)
I have installed the katzer/cordova-plugin-printer (https://github.com/katzer/cordova-plugin-printer). And know here comes the questions.
1.- Once installed, I create a file outside the server and client folder and insert a statement such as
if (Meteor.isCordova) {
console.log("Printed only in mobile Cordova apps");
}
and then do I simply add the following line?
if (Meteor.isCordova) {
document.addEventListener('deviceready', function () {
// cordova.plugins.printer is now available
}, false);
}
2.- If this is correct, Do I create a Meteor Method in the server or in Meteor.isCordova? to call the following example.
var page = '<h1>Hello Document</h1>';
cordova.plugins.printer.print(page, 'Document.html');
3.- Should I use server side rendering to create the
var page = '<h1>Hello Document</h1>';
part.
Thank you
To answer your points:
Meteor.startup is run when the device or browser is ready (it's equivalent to what you are doing).
Create a method in the client code - Put the check in the button click method. Something like the code block at the end
Server side rendering won't apply as you are printing from the browser
if (Meteor.isCordova) {
Meteor.call("myPrintMethod",other-info);
} else {
alert("Sorry, I can only print from the device"
}
I need to add a map in my adddon and I know how to do what I need in a "common webpage", like I did here: http://jsfiddle.net/hCymP/6/
The problem is I really don't know how to to the same in a Firefox Addon. I tryed importing the scripts with LoadSubScript and also tryed adding a chrome html with the next line:
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
But nothing works. The best solution I found was to add part of the code in this file (the code of the script src) in my function, to import this file with loadSubScript, and all my function is executed but an empty div is returned.
Components.utils.import("resource://gre/modules/Services.jsm");
window.google = {};
window.google.maps = {};
window.google.maps.modules = {};
var modules = window.google.maps.modules;
var loadScriptTime = (new window.Date).getTime();
window.google.maps.__gjsload__ = function(name, text) { modules[name] = text;};
window.google.maps.Load = function(apiLoad) {
delete window.google.maps.Load;
apiLoad([0.009999999776482582,[[["https://mts0.googleapis.com/vt?lyrs=m#227000000\u0026src=api\u0026hl=en-US\u0026","https://mts1.googleapis.com/vt?lyrs=m#227000000\u0026src=api\u0026hl=en-US\u0026"],null,null,null,null,"m#227000000"],[["https://khms0.googleapis.com/kh?v=134\u0026hl=en-US\u0026","https://khms1.googleapis.com/kh?v=134\u0026hl=en-US\u0026"],null,null,null,1,"134"],[["https://mts0.googleapis.com/vt?lyrs=h#227000000\u0026src=api\u0026hl=en-US\u0026","https://mts1.googleapis.com/vt?lyrs=h#227000000\u0026src=api\u0026hl=en-US\u0026"],null,null,null,null,"h#227000000"],[["https://mts0.googleapis.com/vt?lyrs=t#131,r#227000000\u0026src=api\u0026hl=en-US\u0026","https://mts1.googleapis.com/vt?lyrs=t#131,r#227000000\u0026src=api\u0026hl=en-US\u0026"],null,null,null,null,"t#131,r#227000000"],null,null,[["https://cbks0.googleapis.com/cbk?","https://cbks1.googleapis.com/cbk?"]],[["https://khms0.googleapis.com/kh?v=80\u0026hl=en-US\u0026","https://khms1.googleapis.com/kh?v=80\u0026hl=en-US\u0026"],null,null,null,null,"80"],[["https://mts0.googleapis.com/mapslt?hl=en-US\u0026","https://mts1.googleapis.com/mapslt?hl=en-US\u0026"]],[["https://mts0.googleapis.com/mapslt/ft?hl=en-US\u0026","https://mts1.googleapis.com/mapslt/ft?hl=en-US\u0026"]],[["https://mts0.googleapis.com/vt?hl=en-US\u0026","https://mts1.googleapis.com/vt?hl=en-US\u0026"]],[["https://mts0.googleapis.com/mapslt/loom?hl=en-US\u0026","https://mts1.googleapis.com/mapslt/loom?hl=en-US\u0026"]],[["https://mts0.googleapis.com/mapslt?hl=en-US\u0026","https://mts1.googleapis.com/mapslt?hl=en-US\u0026"]],[["https://mts0.googleapis.com/mapslt/ft?hl=en-US\u0026","https://mts1.googleapis.com/mapslt/ft?hl=en-US\u0026"]]],["en-US","US",null,0,null,null,"https://maps.gstatic.com/mapfiles/","https://csi.gstatic.com","https://maps.googleapis.com","https://maps.googleapis.com"],["https://maps.gstatic.com/intl/en_us/mapfiles/api-3/13/11","3.13.11"],[3047554353],1.0,null,null,null,null,1,"",null,null,1,"https://khms.googleapis.com/mz?v=134\u0026",null,"https://earthbuilder.googleapis.com","https://earthbuilder.googleapis.com",null,"https://mts.googleapis.com/vt/icon"], loadScriptTime);
};
//I can't use document.write but use loadSubScript insthead
Services.scriptloader.loadSubScript("chrome://googleMaps/content/Google-Maps-V3.js", window, "utf8"); //chrome://MoWA/content/Google-Maps-V3.js", window, "utf8");
var mapContainer = window.content.document.createElement('canvas');
mapContainer.setAttribute('id', "map");
mapContainer.setAttribute('style',"width: 500px; height: 300px");
mapContainer.style.backgroundColor = "red";
var mapOptions = {
center: new window.google.maps.LatLng(latitude, longitude),
zoom: 5,
mapTypeId: window.google.maps.MapTypeId.ROADMAP
}
var map = new window.google.maps.Map(mapContainer,mapOptions);
return mapContainer;
Can you help me? I'm developing a "Firefox for Android" addon and that's why I need to do things like *window.content.*document.createElement because document is not declared, only window and I think thats may be the problem... But I can't declare everything if I don't know what Google Maps uses.
Added: I also read that Google Maps API Team has specific code that disallows you from copying the main script locally. In particular, that code "expires" every so many hours. I'm combined part of this script: https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false because I can't execute this directly (Error: write called on an object that does not implement interface HTMLDocument). So I don't have any alternative!
Use an iframe (type=content if in XUL) to display web content. There you can include whatever scripts you like. The content in the iframe will not have any special privileges, or at least should not. If you need to communicate with the privileged add-on part of your code, you can use e.g. regular HTML events (createEvent, addEventListener and friends) or the postMessage web API to pass messages.
Do not try to load remote code directly into other pages, or worse, into the browser, as this is a compatibility and security nightmare.
Because loading remote code and/or code not properly reviewed for running in a privileged context, the platform will refuse to load such scripts from remote sources (http, etc.) via loadSubScript, etc.
Should be noted, that if you'd later like to host your add-on on addons.mozilla.org and still do include remote scripts in privileged code, your add-on will be rejected until you fix it.
Also, mozilla might blocklist your add-on even if you host elsewhere if it is discovered that there are known security vulnerabilities in your add-on, per the Add-on Guidelines.
After watching a demo on Firebase, I jumped in and tried to worked on an idea, collaboration on the same document. Turns out they already have Firepad as an example, but I still wanted to work on my own to better understand how Firebase works.
Using jQuery and Ace Editor, I'm able to create new documents but I find it hard to update once I started integrating Ace.
But then I'm getting an error from firebase.js
too many recursions
Changing the data on Firebase Forge automatically reflects on my page, but I cant seem to push my changes back to Firebase. Any ideas on how you'd pull this off?
--- EDIT---
Here's a sample code for a better view of what I'm working on.
var fileRef = new Firebase('https://user.firebaseio.com/document/body');
var editor = ace.edit("codepad");
editor.setTheme("ace/theme/monokai");
editor.getSession().setMode("ace/mode/php");
fileRef.on('value', function(snapshot){
var file = snapshot.val();
editor.setValue(snapshot.val());
});
editor.getSession().on('change', function(e) {
fileRef.set(editor.getValue());
});