Laravel-mix: New standalone install fails on npm run hot

Created on 30 Mar 2017  ยท  6Comments  ยท  Source: JeffreyWay/laravel-mix

  • Laravel Mix Version: 0.9.2
  • Node Version: 6.7.0
  • NPM Version 3.10.9:
  • OS: mac OSX 10.12.5 Beta

Description:

I just tried to make a new installation according to the docs:

mkdir my-app && cd my-app
npm init -y
npm install laravel-mix --save-dev
cp -r node_modules/laravel-mix/setup/** ./

created the files src/app.scss and src/app.js and added the scripts to the package.json.

now 3 of the scripts work fine, except for the npm run hot where I get this error:

> [email protected] hot /Developer/xx
> cross-env NODE_ENV=development webpack-dev-server --inline --hot

fs.js:640
  return binding.open(pathModule._makeLong(path), stringToFlags(flags), mode);
                 ^

Error: EACCES: permission denied, open '/hot'
    at Error (native)
    at Object.fs.openSync (fs.js:640:18)
    at Object.fs.writeFileSync (fs.js:1333:33)
    at File.write (/Developer/xx/node_modules/laravel-mix/src/File.js:88:12)
    at Mix.detectHotReloading (/Developer/xx/node_modules/laravel-mix/src/Mix.js:104:18)
    at Mix.initialize (/Developer/xx/node_modules/laravel-mix/src/Mix.js:42:14)
    at Object.<anonymous> (/Developer/xx/webpack.config.js:18:5)
    at Module._compile (module.js:556:32)
    at Object.Module._extensions..js (module.js:565:10)
    at Module.load (module.js:473:32)
    at tryModuleLoad (module.js:432:12)
    at Function.Module._load (module.js:424:3)
    at Module.require (module.js:483:17)
    at require (internal/module.js:20:19)
    at requireConfig (/Developer/xx/node_modules/webpack/bin/convert-argv.js:96:18)
    at /Developer/xx/node_modules/webpack/bin/convert-argv.js:109:17

My folder looks like this:

.
โ”œโ”€โ”€ README.md
โ”œโ”€โ”€ dist
โ”‚ย ย  โ”œโ”€โ”€ app.css
โ”‚ย ย  โ”œโ”€โ”€ app.js
โ”‚ย ย  โ””โ”€โ”€ index.html
โ”œโ”€โ”€ mix-manifest.json
โ”œโ”€โ”€ node_modules (and all installed dependencies)
โ”œโ”€โ”€ package.json
โ”œโ”€โ”€ src
โ”‚ย ย  โ”œโ”€โ”€ app.js
โ”‚ย ย  โ””โ”€โ”€ app.scss
โ”œโ”€โ”€ webpack.config.js
โ””โ”€โ”€ webpack.mix.js

Most helpful comment

Can you add mix.setPublicPath('dist') at the top of your webpack.mix.js file and then try again?

All 6 comments

Can you add mix.setPublicPath('dist') at the top of your webpack.mix.js file and then try again?

It seems like file permission issue. Where you have placed your project ?
I could not understand this path
/Developer/xx
Can you dump the output of -

cd your-project-path/
pwd

@JeffreyWay ah yeah, adding that worked. weird - i thought i had tried that yesterday too.

@ankurk91 I am making use of the /Developer/ folder of macOS, nothing special. read/write permissions are set correctly (I run over 100 projects from there)

@lucidlemon Hey, for me not in full beauty. mix.setPublicPath('dist') shifts hot to dist, true. But also requires css-from-sass to change output
Before

.sass('src/main/js/assets/app.sass', 'dist/')

After

.sass('src/main/js/assets/app.sass', 'dist/dist/')

but (double unexpectedly) not my js
Before

.js('src/main/js/main.js', 'dist/')

After

.js('src/main/js/main.js', 'dist/')

Completely lost :)

Hi @JeffreyWay it's not working by putting setPublicPath on the top. It seems when i change to publicPath the temporary 0.82ec93ab6a5586f3a449.hot-update.js could not created.

fs.js:641
  return binding.open(pathModule._makeLong(path), stringToFlags(flags), mode);
                 ^

Error: ENOENT: no such file or directory, open '/Users/stefan/www/project/public/assets/public/0.82ec93ab6a5586f3a449.hot-update.js'
    .setPublicPath('public/assets/public')

    .js('resources/assets/js/public.js', 'public/assets/public')

    .extract([
        'vue',
        'axios',
        'jquery',
        'floatthead',
        'bootstrap-sass',
        'moment',
        'autosize',
        'vue-router',
        'vue2-filters',
        'lodash',
    ], 'public/assets/public')

    .autoload({
        'jquery': 'jQuery' // boostrap-sass needs this
    })

    .sass('resources/assets/sass/public.scss', 'public/assets/public')

    .browserSync({
        proxy: 'aphlis.val',
        files: ['public/assets/public/**/*', 'resources/views/public/**/*'],
    })

    .version();

I tried also to with

    .js('resources/assets/js/public.js', '')

in all outputs but with no success.

Any idea?

@StefanNeuser

// run versioning on production only
if (mix.inProduction()) {
    mix.version();
}
Was this page helpful?
0 / 5 - 0 ratings

Related issues

jpriceonline picture jpriceonline  ยท  3Comments

dtheb picture dtheb  ยท  3Comments

rlewkowicz picture rlewkowicz  ยท  3Comments

kpilard picture kpilard  ยท  3Comments

Micaso picture Micaso  ยท  3Comments