Vue Deployment - modules[moduleId] is undefined on page load - vue.js

Currently have an Azure pipeline that is watching the staging branch and building on changes using npm and Vue CLI 3. Everything has been working fine until there was a new merge and build, which caused the error t[e] is undefined to show up. I removed minification and saw that the error was module[moduleId] is undefined on page load. Everything runs fine locally, and everything had been running fine deployed prior to this.
There was a Vuetify plugin update that has since been reverted without change. I've also had this issue with the D3 library (which is currently in use), but I'm wondering if the issue is just that the building is no longer working in the pipeline, or if everything needs to be rebuilt from scratch or a cache needs to be cleared (I'm not a DevOps guy).
Anyone have any insight for an app suddenly breaking like this?
EDIT: Seems to be related to the d3 library. Any reason why it would work locally but not when deployed? And with no errors on building?

Related

Debug and Hot Reload not working with NativeScript in VS Code

I have just installed NativeScript and the VS Code extension for it, and built a sample 'empty' Vue app as directed.
The build worked with no errors (although took a long time!) and the basic app is running on my Android device. But breakpoints don't work , and changes in the .vue files are not being hot-reloaded to the device. The debug console has
Successfully applied update
whenever i make a change (just a small message text edit) but nothing happens on the device. But I also have this error in the console:
Error when trying to require webpack.config.js file from path 'C:\Users\quilk\source\repos\NStest\nstest\webpack.config.js'. Error is: Error: Cannot find module 'C:\Users\quilk\AppData\Local\Programs\Microsoft VS Code\package.json'
and sure enough, there is no package.json at that location.
Running the command tns doctor reports no errors.
There's a similar question here but it's 4 years old and maybe things have moved on since then?
I can probably work without hot reload, but debugging with breakponits will be essential.

React Native TypeError: Cannot read property 'indexOf' of undefined, js engine: hermes

I am working on a react-native project. I have been running the application on Android and iOS devices for the past 6 months. I haven't faced any problems till now. But suddenly today, while I am trying to run the application I am getting a compile error with the description. TypeError: Cannot read property 'indexOf' of undefined, js engine: hermes. I tried to debug the issue and found that there is an issue while connecting to the remote debugger. But the strange thing here is even I haven't selected the remote debugging option from either of emulator or simulator.
So, I have enabled the remote debugging option from the emulator to get a quick fix. It is working fine. But why is it connected to the remote debugger even after the fresh installation? And the quick fix comes with its own issues. The application is functioning a bit lag and inconsistent. I suspect there is an issue with the metro bundler. I have removed the cache using rm -rf /tmp/metro-* command, cleaned gradle using ./gradlew clean command, and cleaned iOS build by deleting derived Data. But still, the issue persists.
Is there any other step am I missing here? If it is the issue with the metro bundler, is there any way to reset it completely? Please check the attached image for more information.
The reason for this issue in my case is not with the metro bundler or its cache but with one of the third-party dependency named auth0-js(In your case it would be different). It is adding some global or window properties which are causing the above-mentioned issue. I have removed it and replaced with the library which is closed to react-native ecosystem which eventually resolved the issue.

Unable to load script. Make sure you're either running a Metro server (run 'react-native start') or that your bundle index.android.bundle is packaged

So this has been asked before but I'm asking it again because nothing has worked, I've read through all of the similar posts I could find and all but one has semi fixed the problem.
https://medium.com/#adityasingh_32512/solved-unable-to-load-script-from-assets-index-android-bundle-bdc5e3a3d5ff
This medium article is the only solution that i can find that will get debug builds running again but that is only because it is pre packaging the javascript bundle and not really fixing the problem of the app not connecting to the metro server, once the debug build is running via this method I'm unable to shake the device and get the debug menu to show up.
I've been developing this app for probably 10 months, live for 3-4 months, and can usually trudge through these errors that pop up but this one is tricky.
I've been using cleartextTrafficPermitted="true", tried implementing a custom network security config android:networkSecurityConfig="#xml/network_security_config", tried a different physical device, cleared the metro cache, deleted .gradle/ build folders, cleaned, rebuilt.. All with the same end result of the app crashing on boot and the same error in logcat Unable to load script. Make sure you're either running a Metro server (run 'react-native start') or that your bundle 'index.android.bundle' is packaged correctly for release.
Release builds work but that's because its not trying to connect to the metro server, pretty stumped on this one.
Answering this for others that might find it useful. Still not sure what I did wrong but in the process of setting up a CI/CD pipeline for the app I re cloned the project and magically android debug builds started working again. No changes to the code, the android project must have gotten corrupted somehow so recloning allowed android studio to start from square one. Weird one.

how to build electron app with vue cli 3?

Im building my first electron app and I want to use VueJs, I have installed vue via the cli3.
When i run the app in dev its all fine, however in production (after running a build) there is a warning in the console that vue builds are designed to run over an http-server. This is usually fine since it will be, however to embed vue in an electron app, I wont be using an http-server to serve the vue app.
the net effect of this is that when i build my electron app and run it, I just see a blank screen and none of the js/css/img files get loaded (all 404).
Does anyone know how to resolve this?
I reviewed so many vue/electron tutorials but they only cover dev, none of them seem to go as far as building it and running the finished product.

Aurelia bundling and exporting not works properly

It is maybe a trivial question but I am quite lost in topic I don't know.
I am writing my first app n Aurelia using ES2016. I wanted to export my app to server for some testing.
As I learn in Plularsight course https://app.pluralsight.com/library/courses/aurelia-fundamentals/ that the easiest way to bundle and export is to use Aurelia Skeleton Navigation - by changing all theirs src files to ours and adding all the missing dependencies in package.json, and also adding them to bundle.js and export.js.
When I use
git bundle
git serve
Bundling works fine, and app is running fine.
But when i run
gulp export
The files in export dir not working properly. I have an "Uncaught SyntaxError: Unexpected token <" error in almost js file I wrote or added to my App (not in aurelia files :/ I deployed it temporally here so you can check https://amazingcms-0-3.firebaseapp.com/drag/posts
It looks like I messed it up at all :/ I don't know what files I should show you to help, so please tell me, or give mi a good source where I can learn how to export my app. It is possible to do it without the Aurelia Skeleton Navigation? I think I even don't necessarily need bundling only transpiling (I'm using Babel runtime). I want to check if my app works on server it can work slow at this step.