I've upgraded to Laravel 9 recently.
Here is my package.json:
{
"private": true,
"scripts": {
"dev": "vite",
"build": "vite build"
},
"devDependencies": {
"#vitejs/plugin-vue": "^3.0.3",
"autoprefixer": "^10.4.8",
"axios": "^0.21",
"laravel-mix": "^6.0.6",
"laravel-vite-plugin": "^0.6.0",
"lodash": "^4.17.19",
"postcss": "^8.4.16",
"tailwindcss": "^3.1.8",
"vite": "^3.0.9"
},
"dependencies": {
"alpinejs": "^3.8.1",
"laravel-echo": "^1.11.3",
"pusher-js": "^7.0.3"
},
"name": "beastburst-website",
"description": "<p align=\"center\"><img src=\"https://raw.githubusercontent.com/laravel/art/master/logo-lockup/5%20SVG/2%20CMYK/1%20Full%20Color/laravel-logolockup-cmyk-red.svg\" width=\"400\"></p>",
"version": "1.0.0",
"main": "tailwind.config.js",
"directories": {
"test": "tests"
},
"repository": {
"type": "git",
"url": "https://code.scarsgaming.net/BeastBurst/BeastBurst-Website.git"
},
"keywords": [],
"author": "",
"license": "ISC"
}
When I run npm run watch I get the following error:
npm ERR! Missing script: "watch"
npm ERR!
npm ERR! To see a list of scripts, run:
npm ERR! npm run
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/venelin/.npm/_logs/2022-08-31T11_40_11_910Z-debug-0.log
Any idea why and how can I fix that?
The default bundler for Laravel now is Vite as you can clearly see from your package.json
If you do not want to use Vite, use this guide to switch to mix
I should also mention that Vite is much faster that mix.
try npm run dev it will work like npm run watch that is because Laravel 9 now uses Vite.
Related
This is my package.json
{
"name": "server",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "node index.js",
"devStart": "nodemon index.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"body-parser": "^1.19.1",
"express": "^4.17.2",
"mysql": "^2.18.1"
},
"devDependencies": {
"nodemon": "^2.0.15"
}
}
When trying to run npm run devStart on visual studio code terminal for mac I get the following errors
% npm run devStart
npm ERR! Missing script: "devStart"
npm ERR! Did you mean this?
npm ERR! npm restart # Restart a package
npm ERR! To see a list of scripts, run:
npm ERR! npm run
...
I get this error:
no such file or directory, stat 'C:\Users\nessa\VS Code\React-Django\website\frontend\build'
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! frontend#1.0.0 deploy: `gh-pages -d build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the frontend#1.0.0 deploy script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
when trying to run npm run deploy.
This is my package.json file located in my .\website\frontend
{
"name": "frontend",
"version": "1.0.0",
"private": true,
"description": "",
"main": "index.js",
"scripts": {
"start": "react-scripts start",
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
"dev": "webpack --mode development --watch",
"build": "webpack --mode production"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"#babel/core": "^7.13.13",
"#babel/preset-env": "^7.13.12",
"#babel/preset-react": "^7.13.13",
"babel-loader": "^8.2.2",
"css-loader": "^5.2.0",
"gh-pages": "^3.1.0",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"style-loader": "^2.0.0",
"webpack": "^5.28.0",
"webpack-cli": "^4.6.0"
},
"dependencies": {
"#babel/plugin-proposal-class-properties": "^7.13.0",
"#material-ui/core": "^4.11.3",
"#material-ui/icons": "^4.11.2",
"#material-ui/lab": "^4.0.0-alpha.57",
"react-material-ui-carousel": "^2.2.4",
"react-router-dom": "^5.2.0",
"react-speech": "^1.0.2"
}
}
I've been running npm run dev from the same location all the time without issues. I'm trying to host my react app on Github. I tried reinstalling gh-pages in case a file didn't properly install but am having the same problems. What should I do to resolve this?
Edit: I tried to do what was said here, but still didn't work. Here's my webpack.config.js if that helps.
const path = require("path");
const webpack = require("webpack");
module.exports = {
entry: './src/index.js',
output: {
path: path.resolve(__dirname, './static/frontend'),
filename: '[name].js',
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
},
},
{
test: /\.css$/i,
use: ['style-loader', 'css-loader'],
},
],
},
optimization: {
minimize: true,
},
plugins: [
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('development'),
}),
],
}
I also changed "build": "webpack --mode production" in my package.json scripts to "build": "webpack --mode development", in order to run npm run build, but the problem still isn't fixed.
This was my error:
ENOENT: no such file or directory, stat 'C:\Users...\dist'
So I added
"predeploy": "npm run build",
"deploy": "gh-pages -d build",
on package.json in "scripts".
And run the command npm install gh-pages --save-dev in terminal.
Finishing with npm run deploy.
After you add predeploy, deploy in script in JSON file.
run : npm run build
run : npm run deploy
I am trying to add sass/scss loader AFTER creating a project with vue CLI.
I ran this script:
$ npm install -D sass-loader#^10 sass
and I am receiving following error:
npm ERR! notsup Unsupported platform for fsevents#2.3.1: wanted {"os":"darwin"} (current: {"os":"linux","arch":"x64"})
npm ERR! notsup Valid OS: darwin
npm ERR! notsup Valid Arch: undefined
npm ERR! notsup Actual OS: linux
npm ERR! notsup Actual Arch: x64
It worked for me in empty project that i created to test this. But in my project does not work.
I am using Ubuntu 20.04
this is my package.json file:
{
"name": "hikegear",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"#fortawesome/fontawesome-svg-core": "^1.2.34",
"#fortawesome/free-solid-svg-icons": "^5.15.2",
"#fortawesome/vue-fontawesome": "^3.0.0-3",
"chart.js": "^2.9.4",
"core-js": "^3.6.5",
"sortablejs": "^1.13.0",
"vue": "^3.0.5",
"vue-router": "^4.0.3",
"vuedraggable": "^4.0.1",
"vuex": "^4.0.0-rc.2",
"vuex-persistedstate": "^4.0.0-beta.3"
},
"devDependencies": {
"#vue/cli-plugin-babel": "~4.5.0",
"#vue/cli-plugin-eslint": "~4.5.0",
"#vue/cli-service": "~4.5.0",
"#vue/compiler-sfc": "^3.0.0",
"babel-eslint": "^10.1.0",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^7.0.0-0"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/vue3-essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "babel-eslint"
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead"
]
}
try deleting your package-lock.json file and node_modules folder and then installing your dependencies again
rm -r node_modules package.json
npm i
Yes you can. add following dependecis in your package.json and run npm i.
"devDependencies": {
"sass-loader": "^7.2.0",
"sass": "^1.22.10",
}
for add global variables you need to make vue.config.js in root directory if not exist. then add your scss varibale file.
module.exports = {
css: {
loaderOptions: {
sass: {
additionalData: '#import "#/assets/styles/file.scss";',
implementation: require('node-sass')
},
},
},
};
Our production environment have to using "npm install --production" to install the project, but when trigger "npm run serve" that encounter Below error:
'vue-cli-service' is not recognized as an internal or external command,
operable program or batch file.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
Here is the command sequence :
npm install --production
npm run serve
Below is the package.json
{
"name": "xxxxxx",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"axios": "^0.19.0",
"bootstrap": "^4.4.1",
"bootstrap-vue": "^2.7.0",
"core-js": "^3.4.3",
"vue": "^2.6.11",
"vue-router": "^3.1.3"
},
"devDependencies": {
"#vue/cli-plugin-babel": "^4.1.0",
"#vue/cli-plugin-eslint": "^4.1.0",
"#vue/cli-service": "^4.1.0",
"babel-eslint": "^10.0.3",
"eslint": "^5.16.0",
"eslint-plugin-vue": "^5.0.0",
"vue-template-compiler": "^2.6.11"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"rules": {
"no-console": "off"
},
"parserOptions": {
"parser": "babel-eslint"
}
},
"browserslist": [
"> 1%",`enter code here`
"last 2 versions"
]
}
Could anyone help on this case ? Many thanks...
Does the serve script require your devDependencies? If you run npm install then npm run serve does it work?
Can you run vue --version from your prod environment? That error makes me think the whole #vue/cli global install is missing.
Post may be a dupe: How to solve 'vue-cli-service' is not recognized as an internal or external command?
Just in case, you may want to rm -rf node_modules then install, then serve.
"npm run react-dev" command gives this jsonparse error occurs repeatedly.
npm ERR! code EJSONPARSE
npm ERR! Failed to parse json
npm ERR! Unexpected token in JSON at position 595 while parsing ' {
npm ERR! "name": "reactnodetutorial",
npm ERR! "vers'
Tried the following but none worked.
1) deleted all directories and files and restarted this project from the scratch like building architecture and installing dependencies
2) deleted all contents in package.json file and copied the tutorial example's package.json contents which is perfect and pasted it to mine
3) update node and npm to the latest version
4) npm init and reinstall dependencies
5) npm cache clean --force
6) rm -f package-lock.json
How to possibly fix this.
My package.json file is as follows:
{
"name": "reactnodetutorial",
"version": "1.0.0",
"description": "",
"main": "webpack.config.js",
"dependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.4",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"body-parser": "^1.18.2",
"express": "^4.16.3",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-router": "^4.2.0",
"react-router-dom": "^4.2.2",
"webpack": "^4.1.1"
},
"devDependencies": {},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "webpack -d --watch",
"start": "node ./server/index.js",
"build": "webpack -p",
"react-dev": "webpack -d --watch",
"server-dev": "nodemon server/index.js"
},
"repository": {
"type": "git",
"url": "git+https://github.com/shinjehere/reactNodeTutorial.git"
},
"author": "",
"license": "ISC",
"bugs": {
"url": "https://github.com/shinjehere/reactNodeTutorial/issues"
},
"homepage": "https://github.com/shinjehere/reactNodeTutorial#readme"
}