Upgrading to Compass 0.13 with $rhythm-unit: 'rem'; immediately regains control over consistent sizes of block headings etc. of Omega sub-themes. Great!
BUT ... livereload no longer works.
The scss directories are correctly watched and compilations to css carried out upon saving of scss source. But browsers don't get connected.
drush omega-guard informs: LiveReload 1.6 is waiting for a browser to connect. and, after automatic re-compilation: Reloading browser: css/m2-omega.styles.css however, the browser is not refreshed.
Is there an unmet dependency on livereload?
Related
I'm currently implementing the Monaco Editor from Microsoft (https://github.com/microsoft/monaco-editor), with a plugin for yaml validation, autocompletion, etc. . (https://github.com/remcohaszing/monaco-yaml) in our react js APP.
Maybe it is also important to tell you, that our authentication process gets managed via Keycloak.
When I'm running my code in development (React-scripts start) everything is working as expected.
I can create the editor, the schema gets implemented correctly and autocompletion is also working.
BUT as soon as I try to use the editor in PRODUCTION Build it seems that it cant load my workers correctly, following the editor is not working as it should.
I always get these errors in production:
I tried to use monaco-editor-webpack-plugin with React Rewired but it didnt have an positive effect either.
I also tried to use the worker loader to load the workers, but it also didnt help
Any more Ideas how I can fix this ? Has this to do something with CORS ? Because it tries to load files in a url? Or am I missing something ?
Thanks in advance
What I tried: Monaco Webpack Plugin, plain webpack, worker-loader
Expected Behaviour: Monaco Editor with Monaco Yaml working in production build.
Current behaviour: Working fine in development build, cannot load workers in production.
The problem was, that my keycloak (on a different port) rejected to load the working scripts. After handling this problems, the editor is working fine.
Running webpack-dev-server for my react app is suddenly giving me an error re: default-src being set to 'none' in the CSP (Content Security Policy) header. CSPs are not enabled by Webpack by default per their docs, and there were no changes (to my knowledge) that would have enabled them. This project is using react 16.9.0 and webpack-dev-server 3.8.0
I've tried each suggested solution here, updating the webpack config to change the header to default-src self and using react-helmet to add meta tags. I did not use create-react-app for this project, and most of the other suggestions I've seen are specific to a project created with such with an HTML file entry point.
I need to identify where the CSP header is being enabled and either disable it or change the default-src. Any pointers would be greatly appreciated.
I see a static folder in chrome dev tools for my site which has a js subfolder that shows all my react components. I was under the impression that only the minified/webpack output file would be delivered to chrome.
You can set devtool: 'none' or if you're using webpack 4, you can try using --production flag (which effectively does the same thing) to disable sourcemaps. The legible code that you see is due to sourcemaps - your actual code is not being served.
Recently, I downloaded mern.io. The nice thing is they have bundled everything for me. But I am kind of lost. In my last project whenever I changed something on client I could refresh browser and see the changes. With MERN I always see:
webpack building...
webpack built e9c15d7d435381a63771 in 1043ms
At first it was replacing the code on client. Now, I can't make it to propagate changes any more.
Maybe it's an issue with https://github.com/gaearon/react-hot-loader
What am I missing?
Do I have to clean the webpack or caches somehow?
EDIT
The config files can be seen here: https://github.com/Hashnode/mern-starter
The webpack ones are webpack.config.*.js
EDIT 2
The computer restart helped me but only for the first load of the page. I have found this message in the console:
XMLHttpRequest cannot load http://0.0.0.0:8000/50d9888579520587227e.hot-update.json
Which led me here: https://github.com/gaearon/react-hot-loader/issues/56
I wrote a small AngularJS app that seems to run fine everywhere except in Safari (iOS) where I only see a blank page. If I hook up the phone to my mac and run Web Inspector I can see that there are no javascript errors (in fact the app runs fine and by looking at the DOM I see that scope variables are properly evaluated and replaced in the templates). What I DO see are many CSS errors. If I remove the offending CSS styles (Bootstrap 3) the errors go away yet the page remains blank. I tried removing all CSS and most trivial JS libs to no avail.
I'm using the following JS/CSS (in order of appearance on index.html):
bootstrap.min.css (v3.3.6)
bootstrap-theme.min.css (v3.3.6)
app.css (my own stylesheet which literally has two trivial style definitions)
angular.js (v1.4.9)
angular-route.js (v1.4.9)
ui-bootstrap.js (v1.1.2)
ui-bootstrap-tpls.js (v1.1.2)
lodash.js (v4.5.0)
moment.js (v2.11.2)
app.js (my own app)
Backend: Node 0.10 (running on a free OpenShift account) with Express v4. Files are served via the static middleware. No manual uploading is being done; deployment happens straight from the git repo after doing a push.
EDIT: Completely removed all CSS but problem persists. App fully works everywhere and still showing a blank screen on Safari iOS.