Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

mix.js() output outside public folder

See original GitHub issue

Laravel Mix Version: 1.4.5
Node Version: v8.6.0
NPM Version: 5.3.0
OS: Ubuntu 16.04

The below config creates public/mnt/www/resources/assets/js/dist instead of placing .js files in resources/assets/js/dist.

Would highly appreciate any help.

P.S. I need app.css stay in public/css

webpack.mix.js:

let mix = require('laravel-mix');

mix.sass('resources/assets/sass/app.scss', 'public/css')
   .js('resources/assets/js/app.js', '../resources/assets/js/dist')
   .extract(['axios', 'vue'])
   .version();

Issue Analytics

State:
Created 6 years ago
Reactions:2
Comments:5

Top GitHub Comments

22reactions

Lednerbcommented, Nov 1, 2017

Found a workaround or maybe it’s the intended way to do this:

mix.setPublicPath('../static/dist') helps with .js and .sass whereas .combine and .copy does not use the public path?

This works for me:

mix.setPublicPath('../static/dist')
     
     // js file in ../static/dist/theme.js
    .js('js/theme.js', 'theme.js')
    
      // css file in ../static/dist/theme.css
    .sass('scss/theme.scss', 'theme.css')
    
     // does not uses the PublicPath (but maybe intended so)
     // copy('node_modules/font-awesome/fonts', 'fonts')  does not copy to ../static/dist/fonts
    .copy('node_modules/font-awesome/fonts', '../static/dist/fonts') 
    .copy('node_modules/flexslider/fonts', '../static/dist/fonts')

     // does not uses the PublicPath (seems more like a bug than at .copy)
     // .combine( [...], 'theme.css') does not copy to ../static/dist/theme.css
    .combine([
        'scss/fonts.css',
        'node_modules/normalize.css/normalize.css',
        'node_modules/skeleton-css/css/skeleton.css',
        'node_modules/font-awesome/css/font-awesome.min.css',
        'node_modules/flexslider/flexslider.css',
        'node_modules/highlight.js/styles/zenburn.css',
        '../static/dist/theme.css'
    ], '../static/dist/theme.css')
    .version();

6reactions

amrographycommented, Aug 10, 2018

@Lednerb Your method is working for me, but Mix can’t locate mix-manifest.json file, because it’s still looking for it under public directory.

So, I used mix.copy() to copy it to original location:

mix.setPublicPath('../static/dist').copy('../static/dist/mix-manifest.json', '../public/mix-manifest.json')

Top Results From Across the Web

Laravel Mix with public folder outside the project folder

I have chosen to move the public folder outside the project root because I'm ... The mix.setPublicPath() is required to make sure the...

How can I change the public path to something containing an ...

How can I change the public directory where assets are compiled to? I have tried changing the paths within webpack.min.js to: mix.js('resources/ ...

The Mix API | Laravel Mix Documentation

Out of the box, Mix supports a wide array of frameworks and preprocessors. The methods below assume that you've imported mix at the...

How to use the laravel-mix.inProduction function in ... - Snyk

resolve("src/templates"), } // 🎚️ Misc mix.setPublicPath(config.publicFolder) mix.disableNotifications() mix.webpackConfig({ resolve: { alias: source } }) !

Hosting on shared servers | Web Applications in PHP

On shared hosting servers (e.g. sinners.be ), the default folder for your ... the output path for mix.js() to js and for mix.sass()...