I have a vite 3 project. How can I update it to vite 4? Do I need to make a new project from scratch and copy the files? Or do I simply update the version number in package.json, delete node_modules folder and do npm install?
https://vitejs.dev/blog/announcing-vite4.html
They didn't announce any breaking changes so I think you can just upgrade to 4 in packages.json...
I'm gonna try it too.
I find the best way to figure this out is to look at the source code of the npm create template they have.
For example, looking at the vue-ts one from https://github.com/vitejs/vite/blob/main/packages/create-vite/template-vue-ts/package.json you can see the following package file, and then just use that as a guide:
{
"name": "vite-vue-typescript-starter",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vue-tsc && vite build",
"preview": "vite preview"
},
"dependencies": {
"vue": "^3.2.45"
},
"devDependencies": {
"#vitejs/plugin-vue": "^4.0.0",
"typescript": "^4.9.3",
"vite": "^4.1.0-beta.1",
"vue-tsc": "^1.0.24"
}
}
Related
Before posting the issue, I surfed on all possible websites to fix the issue with Node.js- npm cli I am encountering. None of the answers worked for me and I got stuck with. Can someone help to fix it?
The npm cli was running perfectly and it suddenly started to work giving me the traceback Please verify that the package.json has a valid 'main' entry. Even if I re-installed the node.js it has not resolved the issue. (see screenshot below)
The version node.js 16.17.1 on Windows 10
Screenshot:
The content of the package.json
{
"name": "npm-bundled",
"version": "1.1.2",
"description": "list things in node_modules that are bundledDependencies, or transitive dependencies thereof",
"main": "index.js",
"repository": {
"type": "git",
"url": "git+https://github.com/npm/npm-bundled.git"
},
"author": "Isaac Z. Schlueter <i#izs.me> (http://blog.izs.me/)",
"license": "ISC",
"devDependencies": {
"mkdirp": "^0.5.1",
"mutate-fs": "^1.1.0",
"rimraf": "^2.6.1",
"tap": "^12.0.1"
},
"scripts": {
"test": "tap test/*.js -J --100",
"preversion": "npm test",
"postversion": "npm publish",
"postpublish": "git push origin --all; git push origin --tags"
},
"files": [
"index.js"
],
"dependencies": {
"npm-normalize-package-bin": "^1.0.1"
}
}
Thanks in advance.
AKA
[Solved]:
Thanks everyone. The problem was lying in the directory C:\Users\your_comp_name\AppData\Local\node & C:\Users\your_comp_name\AppData\Roaming\npm that only needs to be removed to run npm cli further.
When I create a new Svelte App as explained in the doc https://kit.svelte.dev/docs/introduction#getting-started , I'm doing:
npm create svelte my-app
cd my-app
npm install
npm run dev
Then when I go to http://localhost:3000
I go the following error, while I didn't do anything yet..
Function called outside component initialization
Error: Function called outside component initialization
at get_current_component (/node_modules/svelte/internal/index.mjs:953:15)
at Module.setContext (/node_modules/svelte/internal/index.mjs:985:5)
at root.svelte:14:1
Here is the packaga.json I have:
{
"name": "dapp",
"version": "0.0.1",
"scripts": {
"dev": "vite dev",
"build": "vite build",
"package": "svelte-kit package",
"preview": "vite preview",
"prepare": "svelte-kit sync"
},
"devDependencies": {
"#sveltejs/adapter-auto": "next",
"#sveltejs/kit": "next",
"svelte": "^3.46.0",
"vite": "^2.9.13"
},
"type": "module",
"dependencies": {
"#fontsource/fira-mono": "^4.5.0",
"cookie": "^0.4.1"
}
}
Most likely, it is related with the new version using "vite", but I have absolutely no idea on how to solve this...
I just had this problem, and it happens that the version of vite is outdated.
I fixed the problem by updating vite to the latest version:
yarn upgrade vite --latest
Here I am having a little addiction problem with reaction-native since yesterday................
it completely blocks me from navigating to certain screens etc.
Here is a copy of package. json:
{
"name": "test2",
"version": "0.1.0",
"private": true,
"devDependencies": {
"react-native-scripts": "1.7.0",
"jest-expo": "^22.0.0",
"react-test-renderer": "16.0.0-beta.5"
},
"main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
"scripts": {
"start": "react-native-scripts start",
"eject": "react-native-scripts eject",
"android": "react-native-scripts android",
"ios": "react-native-scripts ios",
"test": "node node_modules/jest/bin/jest.js --watch"
},
"jest": {
"preset": "jest-expo"
},
"dependencies": {
"expo": "^22.0.2",
"mobx-react": "^4.3.4",
"react": "16.0.0-beta.5",
"react-native": "^0.49.5",
"react-native-elements": "^0.18.2",
"react-native-keyboard-aware-scroll-view": "^0.4.1",
"react-native-router-flux": "4.0.0-beta.23",
"react-navigation": "^1.0.0-beta.19"
}
}
How to install these outbuildings?
Where can I fix my problem if you've already had it, see?
thx!
You haven't installed the dependencies in your app. Either running
npm install
Has produced errors for those npm libraries, or it simply hasn't been run. Try running it, and if it still doesn't work, take a look at the contents of ./npm-debug.log for error messages related to it.
ETA: Looking closer, it seems that several of your dependencies require peers of specific versions of react, but you have a different version of react installed.
Are you using react#16.0.0-beta for a specific reason? Things like mobx are looking for react 13/14/15/16, but not 16b. I'd try this:
npm remove -S react
npm install -S react
and see if that works. If you were using the React beta for a reason, you may struggle to get these to talk to each other.
I'm trying to setup my create-react-app instance with webpack-dev-server.
This is my package.json file
{
"name": "reactgs",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.0.0",
"react-dom": "^16.0.0",
"react-scripts": "1.0.14"
},
"scripts": {
"start": "react-scripts start",
"build": "webpack-dev-server --entry ./node_modules/react-scripts/bin/react-scripts.js --output-filename ./dist/bundle.js --inline --progress",
},
"devDependencies": {
"webpack-dev-server": "^2.9.1"
}
}
I don't have a webpack.config.js file.
When I run
npm run build
The output appears as
The following line runs fine.
npm start
I also have webpack setup fine on the same machine for a different project.
Does anyone know how to properly configure webpack for create-react-app?
npm start does the HMR for you out-of-the box. It will host your application using webpack-dev-server --hot itself. You just need to hook the HMR code to tell webpack what to watch and reload as necessary.
This GitHub conversation offers a pretty decent simple solution for hooking HMR (https://github.com/facebookincubator/create-react-app/issues/2317) with and without Redux.
I'm learning to do CRUD in Node, and am having trouble generating the bin folder. Also, the package.json folder which I've generated doesn't contain the dependencies needed to run on localhost.
To generate the app, I used express MyApp
and then npm install npm install mongoose --save
This gave me:
{
"name": "application-name",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node app.js"
},
"dependencies": {
"express": "3.5.2",
"jade": "*",
"mongoose": "^4.5.4"
}
}
It did not generate a bin folder, or www file hiding elsewhere. I'm using Fedora 23, in case that makes a difference here. Please let me know if there's something I've missed, or if you have any suggested work-arounds.