I created a svelte app using Vite from the Svelte template. I have a tiny package.json and I want to start using Sveltekit. Here is the package.json
{
"name": "jxb2",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
},
"devDependencies": {
"#sveltejs/vite-plugin-svelte": "^2.0.2",
"svelte": "^3.55.1",
"vite": "^4.1.0"
},
"dependencies": {
"axios": "^1.3.2"
}
}
However, the docs dont say anything about making this ugprade. Sveltekit talks about how to create a project but says nothing about upgrading from svelte. I want to use the routing feature.
I can find a page about migrating from sapper but i dont want to do that, I want to get there from Svelte
What I ended up doing was just copy-pasting my whole project over from the svelte proj into the sveltekit proj
Took about three minutes because it's still a small job. Mostly changed ./path to ../path to accommodate my files now being in /src/routes instead of /src/App.svelte
Related
I have published a git repo (https://github.com/GeorgeFlorian/Forkify-App) to Netlify (https://forkify-jorje.netlify.app/) after following an Udemy tutorial:
Everything works locally, but when I deploy it I get
Uncaught ReferenceError: Fraction is not defined
at View.js:96
Fraction is not even inside View.js module: https://github.com/GeorgeFlorian/Forkify-App/blob/main/src/js/views/View.js
It is inside another one: https://github.com/GeorgeFlorian/Forkify-App/blob/main/src/js/views/recipeView.js
I don't know how to recreate this bug. All I did was follow the tutorial. The tutor's deployment worked, mine did not.
This is package.json:
{
"name": "forkify-app",
"version": "1.0.0",
"description": "",
"default": "index.html",
"scripts": {
"start": "parcel index.html --open",
"build": "parcel build index.html --dist-dir ./dist"
},
"repository": {
"type": "git",
"url": "git+https://github.com/GeorgeFlorian/Forkify-App.git"
},
"author": "",
"license": "ISC",
"bugs": {
"url": "https://github.com/GeorgeFlorian/Forkify-App/issues"
},
"homepage": "https://github.com/GeorgeFlorian/Forkify-App#readme",
"devDependencies": {
"#parcel/transformer-sass": "^2.0.1",
"parcel": "^2.0.1"
},
"dependencies": {
"core-js": "^3.19.2",
"fractional": "^1.0.0",
"regenerator-runtime": "^0.13.9"
}
}
I can't find anything relevant online and that's why I've posted here.
I got the same error, did the same JS Udemy course by Jonas lol. I found out the problem has to do something with parcel hoisting. Insert --no-scope-hoist in front of the build command like this & try
parcel build index.html --no-scope-hoist
Use a different package Fracty instead of Fractional
For some reason, none of those 2 packages mentioned are working at this time. For those encountering the same issue, uninstall Fractional and deploy again. It will work, but another solution needs to be applied to cover for the uninstalled package
npm un Fractional
then
git add -A
git commit -m 'Removed Fractional'
then
git push origin master
Test and all app functions should be back to normal, as tested on local, but the fractional features that you'll have to replace.
I'm the author of a library and I need a script to be run each time before webpack bundles my library into the user's app code.
My library's package.json would be something like this:
{
"name": "some-js-library",
"version": "0.1.0",
"scripts": {
"prebuild": "./path/to/my-libs-prebuild-script.js"
}
}
The user's package.json could be anything, for example:
{
"scripts": {
"//": "or however the user uses webpack",
"build": "webpack"
},
"dependencies": {
"some-js-library": "^0.1.0"
}
}
I don't have any control over my users' package.json, so I'm left to wonder if it's possible to have my-libs-prebuild-script.js executed every time before webpack starts building?
Ideally this would be a standard that every bundler agrees on, but a webpack only solution would be fine.
Thanks!
I am trying to expo start in my project and running it on tunnel using IOS. I have tried searching for it, creating new project and tried everything I found on internet but nothing works.
My package.json
{
"name": "test_proj",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"expo": "32.0.0",
"react": "16.6.3",
"react-native": "0.58.5"
},
"devDependencies": {
"babel-core": "7.0.0-bridge.0",
"babel-jest": "24.1.0",
"jest": "24.1.0",
"metro-react-native-babel-preset": "0.52.0",
"react-test-renderer": "16.6.3"
},
"jest": {
"preset": "react-native"
}
}
App.json
{
"name": "test_proj",
"displayName": "test_proj",
"expo": {
"sdkVersion": "32.0.0"
}
}
From the Expo documentation
Expo SDK v32.0.0 is based once again on React Native 0.57 “September 2018”, the same major version as SDK 31.
So as far as I am aware SDK 32 only works with react-native: 0.57.1 so trying other versions won't work.
In Expo projects the react-native dependency usually looks like this in the package.json
react-native: "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz"
So returning your react-native dependency to what it was originally may fix the issue.
An alternative reason for the mismatch error is that it can be caused by using the bundler with one version of react-native and then trying to use a different version without clearing the bundler.
To fix this error you can do it by:
Closing the bundler
Clearing the cache
Restarting the bundler
Restarting the app
This is my 1st question in this site :)
I'm pretty new to coding and I'm currently working in react.
I was making my first project yesterday, today I went back to it and initialized live-server and babel compiler for my jsx component, this is the code I put in:
C:\Users\asus\Desktop\Adolf\react-course-projects\indecision-app>babel src/playg
round/play.js --out-file=public/scripts/app.js --presets=env, react --watch
But after I hit enter all it answers its:
"react doesn't exist"
if I take "react" off the code and leave just env it works fine , but I think it must be there for correct parsing or something... i already did npm install again...
This is my package.json
{
"name": "indecision-app",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
"dependencies": {
"babel-preset-env": "1.5.2",
"babel-preset-react": "6.24.1"
}
}
Seems like both dependencies are there...
Any ideas?
Thanks in advance! :)
It looks like you're missinng react package.
But if you're new to React, I would suggest to start with create-react-app https://github.com/facebook/create-react-app. That will setup everything for you, it's easier to start with that.
{
"name": "indecision-app",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
"dependencies": {
"babel-preset-env": "1.5.2",
"babel-preset-react": "6.24.1"
"react": "16.3.1",
"react-dom": "16.3.1",
}
}
you need to install react and react-dom use npm install --save react react-dom to add those on you dependencies.
In this tutorial, you're supposed to cut the JSX written in public/scripts/app and pasted it in src/app . Your babel command then requests that the JSX in src/app gets transpiled into the 'output file' public/scripts/app.
Unless the JSX is in the right file, you'll also get the same error you described.
the following command should not have a space between env and react
babel src/playg round/play.js --out-file=public/scripts/app.js --presets=env, react --watch
try this
babel src/playg round/play.js --out-file=public/scripts/app.js --presets=env,react --watch
it should work
I wrote a small Excel add-in using node.js with jQuery. The source code was generated by "yo office". Below is the content of package.json file.
{
"name": "my-office-add-in",
"description": "",
"author": "",
"version": "0.1.0",
"scripts": {
"start": "browser-sync start --config bsconfig.json",
"validate": "./node_modules/.bin/validate-office-addin"
},
"dependencies": {
"core-js": "^2.4.1",
"jquery": "^3.1.1",
"datatables.net": "^1.10.16",
"datatables.net-dt": "^1.10.16",
"office-addin-validator": "^1.0.1",
"office-ui-fabric-js": "^1.3.0"
},
"devDependencies": {
"browser-sync": "^2.18.5",
"#types/office-js": "^0.0.37"
}
}
I need to get rid of BrowserSync usage and use another command to start my application. The reason I need to do that is my Excel add-in is being placed onto a shared folder and used by multiple users. BrowserSync synchronizes views in browsers of different users who work simultaneously.
Can someone show me the alternative solution? Thanks in advance.
You can use any package that spins up an https web server.
http-server is an alternative you can get using npm.
https://www.npmjs.com/package/http-server
To install:
npm install http-server --save-dev
From there change your start script to "start": "http-server --ssl"
That will start a server at your root directory and you can navigate to your index file.