@TaylorOtwell the new package.json worked for me! However, I'm now getting an error when running npm run dev. All of my assets compile, but at the very top you can see it says that it failed to compile with 1 error, however, it doesn't give any indication as to what error occurred. Here's my output from npm run dev:

 ERROR  Failed to compile with 1 errors

 error


                                                                    Asset       Size  Chunks                    Chunk Names
                                                  js/ajaxScorePassword.js    2.82 kB          [emitted]
  fonts/glyphicons-halflings-regular.eot?f4769f9bdb7466be65088239c12046d1    20.1 kB          [emitted]
  fonts/glyphicons-halflings-regular.ttf?e18bbf611f2a2e43afc071aa2f4e1512    45.4 kB          [emitted]
 fonts/glyphicons-halflings-regular.woff?fa2772327f55d8198301fdb8bcfc8158    23.4 kB          [emitted]
fonts/glyphicons-halflings-regular.woff2?448c34a56d699c29117adc64c43affeb      18 kB          [emitted]
                                                               /js/app.js    1.15 MB       0  [emitted]  [big]  /js/app
                                                             /css/app.css     745 kB       0  [emitted]  [big]  /js/app
                                                        mix-manifest.json   66 bytes          [emitted]
                                                           js/ajaxFind.js    1.86 kB          [emitted]
                                                         js/listSorter.js  551 bytes          [emitted]
  fonts/glyphicons-halflings-regular.svg?89889688147bd7575d6327160d64e760     109 kB          [emitted]
                                                 js/ajaxPostcodeLookup.js    4.03 kB          [emitted]
                                               js/bootstrap-switch.min.js    15.7 kB          [emitted]
                                             css/bootstrap-switch.min.css    6.28 kB          [emitted]
                                   fonts/glyphicons-halflings-regular.eot    20.1 kB          [emitted]
                                 fonts/glyphicons-halflings-regular.woff2      18 kB          [emitted]
                                  fonts/glyphicons-halflings-regular.woff    23.4 kB          [emitted]
                                   fonts/glyphicons-halflings-regular.ttf    45.4 kB          [emitted]
                                   fonts/glyphicons-halflings-regular.svg     109 kB          [emitted]
                                     js/bootstrap/bootstrap-switch.min.js    15.7 kB          [emitted]

I got the issue again this morning. There was an update on laravel elixir, maybe that's the reason why.

I tested on a fresh install of laravel and got the same issue.

Here is the full log of the issue :

 ERROR  Failed to compile with 1 errors

 error  in ./resources/assets/sass/app.scss

Module parse failed: C:\Users\spyzo\Code\test\laravel\resources\assets\sass\app.scss Unexpected character '@' (3:0)
You may need an appropriate loader to handle this file type.
|
| // Fonts
| @import url(https://fonts.googleapis.com/css?family=Raleway:300,400,600);
|
| // Variables

 @ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss
                                                                                                                                                                                                                                                                              Asset      Size  Chunks                    Chunk Names
       /js/app.js   1.16 MB       0  [emitted]  [big]  /js/app
mix-manifest.json  32 bytes          [emitted]

npm ERR! Windows_NT 10.0.14393
npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\spyzo\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js" "run" "dev"
npm ERR! node v7.4.0
npm ERR! npm  v4.1.1
npm ERR! code ELIFECYCLE
npm ERR! @ dev: `node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the @ dev script 'node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the  package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     C:\Users\spyzo\Code\test\laravel\npm-debug.log

spyzo@SPYZOR-PC MINGW64 ~/Code/test/laravel (master)
$

@GilG: same problem here

I am getting this as well. Fresh install of laravel, fresh install of windows and npm too. It worked yesterday before I had to wipe windows.

app.scss Unexpected character '@' (3:0)

You may need an appropriate loader to handle this file type.

@GilG @stuartcusack @dekichan Did you ever solve the "You may need an appropriate loader to handle this file type." issue? I'm getting

You may need an appropriate loader to handle this file type.
|
| // Fonts
| @import url(https://fonts.googleapis.com/css?family=Raleway:300,400,600);
|
| // Variables

 @ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss

@denisrpriebe I reverted to 0.5.8 so that it kinda works again. I know have another issue with ue-loaderlibcomponent-normalizer but I can load the website now.

Before, the mix function in my blade template was getting me an error that he wasn t able to find the css or js file.

I think that mix is broken right now. We just need to wait for a complete fix :) and use an older laravel-mix for now. At least for Windows users as I understand.

@GilG, I'm experiencing the same issue, gonna quit and wait till they fix it, hate workarounds.

Incase anyone is still experiencing this issue, there is a fix on GitHub for it: https://github.com/JeffreyWay/laravel-mix/issues/200

I just went threw the whole post and it's almost completely working. Mix seems to be fixed for windows. There seem to have just a new bug with vue-loader that should be fixed quickly.

We will soon be able to mix everything perfectly as usual.

Love how @JeffreyWay is committed :).

I had same issue and ended up having to run "npm rebuild node-sass" before I could successfully run "npm run dev"

same issue here, every version gets worse and worse...

basically requirement is already "mac".

Big risk with Spark is that authors are to spread out between managing different businesses + they write code.

To do all, it means to do nothing correctly..

I mean you can manage multiple businesses and develop projects in long term successfully? :D

Well I have a similar issue with "npm run dev":

http://prnt.sc/e3uub8

These dependencies were not found in node_modules:

• ../fonts/bootstrap/glyphicons-halflings-regular.eot
• ../fonts/bootstrap/glyphicons-halflings-regular.woff2
• ../fonts/bootstrap/glyphicons-halflings-regular.woff
• ../fonts/bootstrap/glyphicons-halflings-regular.ttf
• ../fonts/bootstrap/glyphicons-halflings-regular.svg

@robertsozols This was driving me insane as well. Post here fixes issue Fresh install: npm run dev & npm run production fail. npm run watch works #280

@denisrpriebe First I solved it by applying some changes in one of the files (solution I found in the GitHub comments of some issue) but I forgot which one was it. It had something to do with changing a path to some file. Anyways, later I made a new install (also tested right now with fresh install) and it works fine. Just don't forget to run npm install first :)

The latest package.json didn't work for me.

npm-debug.log:

0 info it worked if it ends with ok 1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'run', 'dev' ] 2 info using [email protected] 3 info using [email protected] 4 verbose run-script [ 'predev', 'dev', 'postdev' ] 5 info lifecycle @~predev: @ 6 silly lifecycle @~predev: no script for predev, continuing 7 info lifecycle @~dev: @ 8 verbose lifecycle @~dev: unsafe-perm in lifecycle true 9 verbose lifecycle @~dev: PATH: /usr/local/lib/node_modules/npm/bin/node-gyp-bin:/Volumes/Artemis/ChurchTrac Skeptical/node_modules/.bin:/Users/kirklandyuknis/Applications/Gnat/bin:~/.composer/vendor/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Library/Frameworks/Mono.framework/Versions/Current/Commands 10 verbose lifecycle @~dev: CWD: /Volumes/Artemis/ChurchTrac Skeptical 11 silly lifecycle @~dev: Args: [ '-c', 11 silly lifecycle 'node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js' ] 12 silly lifecycle @~dev: Returned: code: 2 signal: null 13 info lifecycle @~dev: Failed to exec dev script 14 verbose stack Error: @ dev: node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js 14 verbose stack Exit status 2 14 verbose stack at EventEmitter. (/usr/local/lib/node_modules/npm/lib/utils/lifecycle.js:279:16) 14 verbose stack at emitTwo (events.js:106:13) 14 verbose stack at EventEmitter.emit (events.js:192:7) 14 verbose stack at ChildProcess. (/usr/local/lib/node_modules/npm/lib/utils/spawn.js:40:14) 14 verbose stack at emitTwo (events.js:106:13) 14 verbose stack at ChildProcess.emit (events.js:192:7) 14 verbose stack at maybeClose (internal/child_process.js:890:16) 14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5) 15 verbose pkgid @ 16 verbose cwd /Volumes/Artemis/ChurchTrac Skeptical 17 error Darwin 16.4.0 18 error argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "dev" 19 error node v7.5.0 20 error npm v4.1.2 21 error code ELIFECYCLE 22 error @ dev: node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js 22 error Exit status 2 23 error Failed at the @ dev script 'node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js'. 23 error Make sure you have the latest version of node.js and npm installed. 23 error If you do, this is most likely a problem with the package, 23 error not with npm itself. 23 error Tell the author that this fails on your system: 23 error node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js 23 error You can get information on how to open an issue for this project with: 23 error npm bugs 23 error Or if that isn't available, you can get their info via: 23 error npm owner ls 23 error There is likely additional logging output above. 24 verbose exit [ 1, true ]

I tried a bunch of stuff that was described in the threads and this is how I as a noob got it to work.

1. Updated Node.

2. Updated NPM.

3. Restarted my Mac computer.

4. deleted the node_module folder (in my fresh new laravel 5.4 project.)

5. Did : npm install (from fresh project folder) 6 Did : npm install https://github.com/JeffreyWay/laravel-mix (from fresh project folder)

6. npm run dev

7. No errors.

Laravel Framework 5.4.12 Node v7.5.0 npm v4.1.2

Best regards Niklas

working with "yarn add webpack babel cross-env"

After a lot of research, I found a solution for me:

OS: OSX 10.11.6

Node: 7.4.0

npm: 4.0.5

Add "babel": { "presets": [ "es2015" ] } to pacakge.json and it fixed everything.

Github: https://github.com/JeffreyWay/laravel-mix/issues/227

I just removed node_modules

rm -rf node_modules/

then run > npm install

then run > npm run dev

it worked for me.

@TaylorOtwell, @JeffreyWay Ok, so I've had a bit of fun with this as well over the last couple days.

First with Windows 10 w/node 6.10.0 and npm 4.4.0

the cross-env.js file is found in /node_modules/cross-env/bin

Then on my other server with Ubuntu 16.04 w/node 6.10.0 and npm 4.3.0

the cross-env.js file is found in /node_modules/cross-env/dist/bin

So for me running npm in windows I need the first path in my package.json and the second path for my Ubuntu server.

I don't know enough about npm to even start coming up with a clue other than for some reason there are different versions of cross-env being installed on Windows and ubuntu.

Note: I also had to run an npm rebuild node-sass before I got things working on my Ubuntu machine after making the needed changes, clearing the node_modules folder and re-running npm install.

This is all with the newest Laravel 5.4 build.

TLDR: Paths are different between windows and Ubuntu for cross-env. A bit bad for win/ubuntu cross platform development!

Regards, Richard

@AccAdmin - It's because you have two different versions installed. Over the weekend, the cross-env team changed then path to to their bin directory, which we were referencing. You can fix this by doing npm install cross-env, and then updating your package.json npm script to be:

cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

Ah, sneaky buggers! I'll give that a go on my windows machine to see if it'll fix the issue!

Regards, Richard

How can solve this mix

Thank you very much Taylor!! I just copied and pasted the one you provided from the depository and VOILÀ: tout marche maintenant! Merci beaucoup.

I was had to upgrade node to get this to work. I was still on v4 and I think this requires node version 6 or higher.

npm cache clean -f
npm install -g n
sudo n stable

cross-env.js is in the path node_modules/cross-env/dist/bin/cross-env.js. the package.json script is missing the "dist" path.

i had same error then I install all front-end dependency by using npm install command or yarn install

I received same error like @Mostafa6765

I found this message in error log

Error: Cannot find module '<folder>\node_modules\cross-env\bin\cross-env.js'

Then I go to check my directory, the cross-env.js is inside '\node_modules\cross-env\dist\bin'.

So, I change the script in package.json to

 "dev": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",

And it work.

My problem was the mix-manifest.json file was blank. I got a copy of the file from a fresh install of laravel which is

{
  "/js/app.js": "/js/app.js",
  "/css/app.css": "/css/app.css"
}

That worked for me.

Has the same issue as 'apt-get install node' downloads an outdated version of the nodejs. I installed the most recent version using the nodesource shell script:

cd ~ curl -sL https://deb.nodesource.com/setup_6.x -o nodesource_setup.sh sudo bash nodesource_setup.sh

this added node 6.x version package to apt-get so now you can install it:

sudo apt-get install nodejs sudo apt-get install build-essential

This solved the errors.