Getting an error trying to load aurelia-dragula (and other plugins) from aurelia-cli.
cli
au-install aurelia-dragula
aurelia.json
{
"name": "aurelia-dragula",
"path": "../node_modules/aurelia-dragula/dist/amd",
"main": "index"
},
...
.js
import { Dragula } from 'aurelia-dragula';
Error :
vendor-bundle.js:23616 ERROR [app-router] Error: Unexpected token <
Evaluating http://localhost:9000/aurelia-dragula
(it's grabbing the index.html in wwwroot folder and failing on parsing the "DocType" tag)
First thing I'd recommend you to do is upgrade aurelia-cli to the latest version (currently 0.33.1).
The unexpected token < is a silly error but it simply means that a non-existing file/url was requested from server (aurelia-dragula in your case). Server returns a standard 404 html page which the app then tries to parse as javascript, and that doesn't work.
Your aurelia.json looks fine (tested it locally on a fresh aurelia-cli project) so it's likely to be either a version or caching issue. After upgrading aurelia-cli I'd recommend deleting the lock files and clearing node_modules, followed by a fresh install.
Related
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.
I'm using Vue 2 (but I think that my question isn't Vue-specific). The application uses a WebAssembly library of mine that I've installed with npm install [directory_name]. When I run npm run serve, it serves the .wasm file as text/html instead of application/wasm.
I add this to vue.config.js:
module.exports = {
// ...
devServer: {
mimeTypes: { 'application/wasm': ['wasm'] },
},
};
But in that case, I get this:
Error: Attempt to change mapping for "wasm" extension from "application/wasm" to "application/wasm". Pass force=true to allow this, otherwise remove "wasm" from the list of extensions for "application/wasm".
Is it possible cli-vue-service/webpack-dev-server already knows about .wasm files, and I've understood something wrong about how we install libraries with npm install?
I'm answering my own question.
It's tricky (assuming it's possible) to get webpack to load the .wasm file because of the way webpack works. What I did was add -s "SINGLE_FILE=1" to emcc's options so that it does not produce a .wasm file; instead, it embeds the wasm in the glue .js file.
Btw I came here after getting this error:
Uncaught (in promise) TypeError: Failed to execute 'compile' on 'WebAssembly': Incorrect response MIME type. Expected 'application/wasm'.
I had a typo in my wasm fetch URL and I was fetching a file that didn't exist, but it was giving me this mime type error. Once I fixed the typo, everything worked. I didn't have to add the mime type to the webpack config. (maybe they fixed it since you posted in February.) I'm using the Vue development server.
I have had no problems with deploying my vue projects so far and uploading it to my website. However suddenly Im getting the following errormessage after I have been running
npm run build
and uploading the files in my distfolder.
Uncaught SyntaxError: Unexpected token '<' chunk-vendors.468a5298.js:1
Uncaught SyntaxError: Unexpected token
'<' app.f775d578.js:1
The only difference I can notice is that vue now seems to recommend using yarn.
I made a new project just for testing using yarn but with the same error.
vue create my-application
yarn install
yarn serve
yarn build
uploading content in distfolder to my website - same errormessage
Anyone else experienced this?
My old build works without any problems
Im using #vue/cli 4.5.6
I got it working now. Deleted the folder on my ftp and created a new one. Dont know this solved it but it did :)
If you are deploying your dist not to your root of the web, then one possible cause of this is an incorrect static assets path. Make sure both your css and js generated from npm run build are imported to the correct path from your web server
On dist/index.html, you will see something like this
<link href=/js/chunk-....js rel=prefetch>
This means that it's an absolute path (root of the web), when it's supposed to be relative from the dist folder like this:
<link href=js/chunk-....js rel=prefetch>
To easily fix this is, add publicPath key in your vue.config.js file:
module.exports = {
...
publicPath: ""
};
Then rebuild the project.
I'm using angular-cli and implemented nanogallery in my project,
now i'm going to build my project:
if i run
ng build --prod
after uploading file to host it throws these errors in console:
jQuery.Deferred exception: i is not a function R/</</<#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:148258
each#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:22422
R/</<#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:145805
R/<#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:145721
R#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:145629
h#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:108785
l#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:108322
r/this.initiateGallery2#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:237166
t.nanogallery2/i.init#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:263620
t.nanogallery2#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:263679
jQuery.fn.nanogallery2/<#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:271921
each#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:22422
each#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:21097
jQuery.fn.nanogallery2#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:271900
M4vW/j</l.prototype.loadBranches/</<#http://ankiweb.ir/4.1155fed864443988871c.chunk.js:1:19424
u#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:48959
r/</h<#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:49257
ZSR1/</</</u</t.prototype.invokeTask#http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:19495
onInvokeTask#http://ankiweb.ir/main.36efe7b363f6a9952e89.bundle.js:1:603433
ZSR1/</</</u</t.prototype.invokeTask#http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:19408
ZSR1/</</</i</e.prototype.runTask#http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:14671
ZSR1/</</</c</e.invokeTask#http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:20589
e/this.invoke<#http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:20474
u/n.args[0]#http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:35813
undefined
ERROR TypeError: "i is not a function"
Rhttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:148258eachhttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:22422Rhttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:145805Rhttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:145721Rhttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:145629hhttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:108785lhttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:108322initiateGallery2http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:237166inithttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:263620nanogallery2http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:263679nanogallery2http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:271921eachhttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:22422eachhttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:21097nanogallery2http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:271900loadBrancheshttp://ankiweb.ir/4.1155fed864443988871c.chunk.js:1:19424uhttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:48959hhttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:49257invokeTaskhttp://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:19495onInvokeTaskhttp://ankiweb.ir/main.36efe7b363f6a9952e89.bundle.js:1:603433invokeTaskhttp://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:19408runTaskhttp://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:14671invokeTaskhttp://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:20589invokehttp://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:204740http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:35813
jQuery.Deferred exception: l.branches[u].gallery is undefined M4vW/j</l.prototype.loadBranches/</<#http://ankiweb.ir/4.1155fed864443988871c.chunk.js:1:19176
u#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:48959
r/</h<#http://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:49257
ZSR1/</</</u</t.prototype.invokeTask#http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:19495
onInvokeTask#http://ankiweb.ir/main.36efe7b363f6a9952e89.bundle.js:1:603433
ZSR1/</</</u</t.prototype.invokeTask#http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:19408
ZSR1/</</</i</e.prototype.runTask#http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:14671
ZSR1/</</</c</e.invokeTask#http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:20589
e/this.invoke<#http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:20474
u/n.args[0]#http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:35813
undefined
ERROR TypeError: "l.branches[u].gallery is undefined"
loadBrancheshttp://ankiweb.ir/4.1155fed864443988871c.chunk.js:1:19176uhttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:48959hhttp://ankiweb.ir/scripts.0334935c44e8c4e6422d.bundle.js:1:49257invokeTaskhttp://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:19495onInvokeTaskhttp://ankiweb.ir/main.36efe7b363f6a9952e89.bundle.js:1:603433invokeTaskhttp://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:19408runTaskhttp://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:14671invokeTaskhttp://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:20589invokehttp://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:204740http://ankiweb.ir/polyfills.d248127361c9f04ac793.bundle.js:1:35813
every thing work's correctly except "gallery"
but if i run
ng build
every thing is ok include "Gallery"
any body know what's the problem!?
thank you!
I resolved this production issue by referencing the none minified versions of jquery and nanogallery in angular.json
so change this...
"scripts": [
"node_modules/jquery/dist/jquery.min.js",
"node_modules/nanogallery2/dist/jquery.nanogallery2.min.js"
]
to this...
"scripts": [
"node_modules/jquery/dist/jquery.js",
"node_modules/nanogallery2/dist/jquery.nanogallery2.js"
]
I don't understand why but the minification and bundling of the already minified nanogallery jquery plugin was causing this issue.
I'm attempting to use the spine.app cli and I'm encountering a couple of errors and I'm uncertain what the root cause actually is.
The guide found at: http://spinejs.com/docs/started gives these steps
spine app my-app
cd my-app
npm install .
hem server
following these steps, initially yields this error on the terminal:
Cannot find module: es5-shimify. Have you run `npm install .` ?
Investigating, it seems es5-shimify has been deprecated in favor of es5-shim, so my initial inclination was to replace the dependency to es5-shim. So I updated setup.coffee to require('es5-shim'), and I updated the referenced slug.json module and restarted the server. This seems to get me a little further, but still produces an error ( though not in the terminal, instead in the chrome console )
Uncaught TypeError: Property 'jQuery' of object [object Object] is not a function
This appears to be occurring on line 8 of public/index.html. I did some debugging here and it appears that require('jqueryify') is returning undefined, and I'm not certain what the expected result is. Any guidance on the right way to approach this process or perhaps information on what the root issue might be would be greatly appreciated.
Use the latest version try again.
The package.json as following
{
"name": "app",
"version": "0.0.1",
"dependencies": {
"spine": "~1.3.0"
}
}
all others dependencies has been removed,and it works for me.