gojs and Aurelia mismatch error - aurelia

I created a new aurelia project and installed gojs via npm. I added gojs to the aurelia.json dependencies and, without adding any gojs code, just tried to build the project. The build worked fine and gojs went to the vendor-bundle.js The issue is, when I run the project, I get an error from gojs. When I remove the gojs dependency in aurelia.json, the project runs just fine but adding it back always throws the same error located below. Please help.
Uncaught Error: Mismatched anonymous define() module: [object Object]
http://requirejs.org/docs/errors.html#mismatch
at makeError (vendor-bundle.js:11531)
at intakeDefines (vendor-bundle.js:12617)
at vendor-bundle.js:12815
makeError # vendor-bundle.js:11531
intakeDefines # vendor-bundle.js:12617
(anonymous) # vendor-bundle.js:12815
setTimeout (async)
req.nextTick # vendor-bundle.js:13178
localRequire # vendor-bundle.js:12812
requirejs # vendor-bundle.js:13160
(anonymous) # vendor-bundle.js:13199
(anonymous) # vendor-bundle.js:13508

To clear up some confusion here, you're talking about declaring the dependency in aurelia.json which implies you're using aurelia-cli in conjunction with the requirejs loader.
jmdavid's answer mentions webpack which is a different beast altogether. You don't declare dependencies in aurelia.json there; webpack resolves those by itself via the imports it finds in your entry file. I would actually recommend switching to webpack for various reasons; the fact that it would fix the error is just one of them.
The error is likely caused by the go.js module being loaded twice. The error throws on the second load; it should still work regardless of the error. You can't make the error go away in any straightforward manner with requirejs, this is due to how the go.js release is packed.
The only error-free way to load go.js here would be to do so before requirejs is loaded. In aurelia.json:
"node_modules/gojs/release/go.js",
"node_modules/requirejs/require.js"
And no need to import it then either, it will just be available globally.

Probably the versions are oudated on fedoranimus github (https://github.com/fedoranimus/aurelia-gojs).
I made it work by creating a new project with the cli (au new) with webpack and typescript, then npm installed gojs (version "^1.8.15"), then copied relevant code from fedoranimus.

Related

Cannot use import statement outside a module when using wrangler v2

I'm new to using cloudflare and wrangler. I've a project that I've been working on, and I'm now trying to deploy it using wrangler publish, but I keep running into issues. My product is coded in node.js, and I'm using version 2 of wrangler. When I execute wrangler publish I get:
Basic JavaScript project found. Skipping unnecessary build!
Error: Something went wrong with the request to Cloudflare...
Uncaught SyntaxError: Cannot use import statement outside a module
at worker.js:2Basic JavaScript project found. Skipping unnecessary build!
Error: Something went wrong with the request to Cloudflare...
Uncaught SyntaxError: Cannot use import statement outside a module
at worker.js:2
I've searched for a solution, and one of them that I found said to change module in wrangler.toml from type="javascript"to type="webpack" however that gives me a bunch of errors:
./node_modules/destroy/index.js
Module not found: Error: Can't resolve 'fs' ... Parsed request is a module...resolve as module
/Users/Desktop/APIs/cpiCalculator2/node_modules/destroy/node_modules doesn't exist or is not a directory
...
Error: webpack returned an error. You may be able to resolve this issue by running npm install.
I've tried reinstalling npm as it suggests and then wrangler publish again, but that just gives me the same error message.
I'm really not sure what the issue is, and I would really appreciate any help or advice on how to resolve this issue. Thank you!
Also, just a note, I'm not sure if this is affecting it, but I do have two other js documents in the main area of my project (where my index.js file is).

compile errors after upgrading to latest CRA

I just updated to latest create-react-app (web pack 5). And am now getting the following errors (I'm just showing the first 2 errors here). Any help explaining what this error means and how to fix it would be greatly appreciated. I don't think the problem is with react-pdf because I created a new create-react-app project that uses that package and there's no problem.
{
Compiled with problems:X
ERROR in ./node_modules/react-pdf/node_modules/#babel/runtime/helpers/esm/inherits.js 1:0-46
Module not found: Error: Can't resolve './setPrototypeOf' in '/Users/bob/dev/workbox-web/node_modules/react-pdf/node_modules/#babel/runtime/helpers/esm'
Did you mean 'setPrototypeOf.js'?
BREAKING CHANGE: The request './setPrototypeOf' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '.mjs' file, or a '.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.
ERROR in ./node_modules/react-pdf/node_modules/#babel/runtime/helpers/esm/objectWithoutProperties.js 1:0-74
Module not found: Error: Can't resolve './objectWithoutPropertiesLoose' in '/Users/bob/dev/workbox-web/node_modules/react-pdf/node_modules/#babel/runtime/helpers/esm'
Did you mean 'objectWithoutPropertiesLoose.js'?
BREAKING CHANGE: The request './objectWithoutPropertiesLoose' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '.mjs' file, or a '.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.
}
Somehow I was accessing a wrong version of babel after CRA upgrade to 5. Deleting node_modules and re-installing was not enough. I needed to delete node_modules and yarn.lock and then yarn install - and then all was ok.

How to fix relative module error for a newly created nuxt.js app with starter template?

I tried to create a nuxt app with the guide from the official website, chose default options because I wanted the starter template but on running npm run dev, I keep encountering the error:
This relative module was not found:
* ./components/nuxt-error.vue in ./.nuxt/index.js
I've tried searching about it but I couldn't find any useful resource/fix. I've also tried vue init nuxt-community/starter-template for the installation but I still get the same error.
Any fixes?
So I found a solution. I couldn’t figure out the error because the nuxt-error.vue file was actually imported correctly. Turns out “npm” installations have been giving me issues (had issues with TailwindCSS too).
So if you ever encounter this error on loading the base nuxt app, recreate the project using “yarn” instead. Works like magic!
This Error basically means, that in one of your files you are trying to import another file with the relative path of ./components/nuxt-error.vue but no file with this path exists.
However
I just read that vue init nuxt-community/starter-template is deprecated and no longer maintained. Instead of fixing this Error you should restart your project with npx create-nuxt-app <yourAppName>. https://github.com/nuxt-community/starter-template

Yarn force a package to use a specific version

I currently have the the following issue when running a unit test using the Jest Vue cli plugin found here. https://www.npmjs.com/package/#vue/cli-plugin-unit-jest
Error I receive is Requires Babel "^7.0.0-0", but was loaded with "6.26.3". If you are sure you have a compatible version of #babel/core, it is likely that somet
hing in your build process is loading the wrong version. Inspect the stack trace of this error to look for the first entry that doesn't mention "#
babel/core" or "babel-core" to see what is calling Babel
I am using Yarn workspaces and would like to know the best way to force #vue/cli-plugin-unit-jest to use babel-core of version ^7.0.0-0

aurelia - error using material-components-web with skelton-esnext project

I've successfully used the material-components-web library from within my aurelia skeleton-esnext-webpack projects but I am strugling to get them working in a skeleton-esnext project.
The problem seems to be with the fact that the skeleton-esnext project uses jspm with system.js as its module loader.
I have added "#material/textfield": "npm:#material/textfield#^0.3.6" to the jspm dependencies section of my package.json which seems to install the correct #material libraries to my jspm_modules/npm/#material.
Now, when I try to access any class from this library from within any my aurelia view models
import {MDCTextfieldFoundation} from '#material/textfield';
I get the following error in the browser when I run the project:
Error: (SystemJS) Unexpected token import
SyntaxError: Unexpected token import
at eval (<anonymous>)
at Object.eval (http://localhost:9000/jspm_packages/npm/#material/textfield#0.3.6.js:1:123)
at eval (....
Any suggestions to whats most likely causing this issue?
SystemJS is importing the raw source file of the plugin instead of the transpiled one (you can see this if you look into jspm_packages/npm/#material/textfield#0.3.6.js.
You can fix it by changing the location in there to point to the dist directory of the directory textfield#0.3.6. However, it gets overriden all the time on potential updates. And it is not saved in CVS.
Another, more simpler approach, would be to import the correct file in your view model:
import {MDCTextfieldFoundation} from '#material/textfield/dist/mdc.textfield';