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!