Laravel valet sage 10 certificate problem for scss source maps

I am playing with Sage 10 and I encountered a problem I didn’t have in Sage 9, or at least it didn’t compromise the development flow.

When I run yarn start the browser cannot load the sourcemaps because there is an error with the certificate:

DevTools failed to load SourceMap: Could not load content for https://localhost:3000/wp-content/themes/sage-cfca2020/dist/styles/app.css.map: Certificate error: net::ERR_CERT_COMMON_NAME_INVALID

  • the site is in local domain cfca2020.test
  • I am using laravel valet and I secured the site using valet secure cfca2020.
  • I changed the browsersync site to ‘https://cfca2020.test’ as without the https:// it didn’t even load the page in Chrome

I searched for a solution regarding laravel mix and the error that I get, and I found this “solution”, but it didn’t work for me.

I used this line in package.json (note the https, key and cert flags:

    "start": "cross-env NODE_ENV=development run-s \"mix -- --https --key /Users/sergiarias/.config/valet/Certificates/cfca2020.test.key --cert /Users/sergiarias/.config/valet/Certificates/cfca2020.test.crt --watch\"",

I also added this options line as recommended in the above link:

mix.options({
   hmrOptions: {
       host: 'cfca2020.test',
       port: 8080
   }
});

But it didn’t work either.

if I load the site through the secured domain https://cfca2020.test it loads the source maps without errors.

In Sage 9, chrome alerted me of cerfificate issues but it loaded the source maps anyway.

Is there something I am missing? I will appreciate some help from the community!

1 Like

Okey, just after posting I tried another solution and it seems it works, I will leave all the info for future searches.

Leaving the start in package.json as it was in the default config, I just edited in webpack.mix.js the browsersync line:

   .browserSync({
      proxy: 'https://cfca2020.test',
      host: 'cfca2020.test',
      open: 'external',
      https: {
          key: "/Users/sergiarias/.config/valet/Certificates/cfca2020.test.key",
          cert: "/Users/sergiarias/.config/valet/Certificates/cfca2020.test.crt"
      }
   });

This topic was automatically closed after 42 days. New replies are no longer allowed.