Repro steps are as follows:
I have a main.css.scss file that looks like this:
#import "defaults";
I have a _defaults.scss file that looks like this:
body { background: #FFF; }
When I first start the site, everything looks good. If I change main.css.scss, everything works as expected. But changes to _defaults.scss are not picked up unless I restart the server or touch main.css.scss
A workaround would be greatly appreciated!
It's really hacky, but this does fix the issue. In one terminal, I run the docpad server. In another terminal, I run this command:
fswatch-run src/documents/css/_* 'touch ./src/documents/css/main.css.scss'
What this does is touch the main scss file any time any of the imported scss files are touched. This in turn causes docpad to pick up the change and recompile the scss. There's probably a much better way to do this, but this works at the moment.
It's too hacky for me to actually accept it as the answer, though.
Related
I have a Laravel project and as you know when you deploy your app everything in your public directory should be copied over to your htdocs or public_html directory to hide your application's code.
I am using webpack to build my react code and everything else and each time I change my javascript webpack does what I want, it sees I make a change and then it builds it.
However I want to add one additional command after it builds and that is to copy everything from the public directory into the correct directory in htdocs/public_html.
So far I read up on this question here Run command after webpack build
It works and I can get the echo to work but I'm not sure why cp isn't working. Echo works but how do I know what shell commands I can use?
I tried 'cp' and even 'copy-item' which is powershell, but none are working.
This is my plugin so far, I figured I needed to change the directory to be safe
before copying anything over but again, nothing is working.
mix.webpackConfig(webpack => {
return {
plugins: [
new WebpackShellPlugin({
onBuildStart: ['echo "Starting Build ..."'],
onBuildEnd: ["cd 'E:\\xammp\\apps\\FactorioCalculator'",
"cp '.\\public\\*' '..\\..\\htdocs\\FactorioCalculator\\' -f -r"]
})
]
};
});
You could always use the copyDirectory mix method. Just put something like the following at the bottom of your webpack.mix.js file:
mix.copyDirectory('public', '../../htdocs/FactorioCalculator/')
You might have to change your path to ..\\..\\htdocs\\FactorioCalculator\\ as per the path in your question (I only have my mac with me so I'm unable to test on my other machine).
To answer you original question, if you want to execute a command each time webpack finishes building you can use the mix.then() which takes a closure.
I've installed these https://github.com/holman/dotfiles .dotfiles, every thing works well, but as I see .zshrc dosent exist anymore in ~/.
So the thing is that I want to overwrite some config from the zshrc.symlink.
First I do ls -l .zshrc and I get /Users/hiero/.dotfiles/zsh/zshrc.symlink.
So if I edit the zshrc.symlink, I add
ZSH_THEME="honukai"
to change the theme but even if I restart, settings are not updated, and I see the old theme, if I $ZSH_THEME - command not found honukai.
I'm doing something wrong?
Can someone please explain how can I fix this?
So if I edit the zshrc.symlink, I add
ZSH_THEME="honukai"
You would need to do more than that. You will need to source your oh-my-zsh configuration, for example as the last statement in zshrc.symlink.
One way or another, if the oh-my-zsh configuration is not included, the theme will not be applied.
if I
$ZSH_THEME - command not found honukai.
Not very clear what you're trying to do there. It looks as if you're trying to run $ZSH_THEME, whose value is honukai, and there is no such command, "honukai".
I just can't get it work. I have a .scss file with some basic CSS.
Now, I have installed Ruby and I installed SASS like so - gem install sass.
What do I do to get it work on sublime?
I installed "SASS" so sublime acknowledge the .SCSS extension. I also installed SASS builder, and it actually works but in an strange way.
In addition to the compiled css file, it also adds .map file and a folder name .sass-cache.
Why Is that? How to I get rid of that? I don't need a .map file.
I also get an alert every single time the build is done. ("style.css has been compiled")
And not only that but I also get this comment at the end of my compiled CSS file:
/*# sourceMappingURL=style.css.map */
Please help, I'm lost.
Thanks in advance.
The .map file is for chrome (and maybe other browsers) to MAP your CSS that is rendered in the browser back to your actual SCSS. This is very very useful when debugging.
The scss-cache is just what it says it is a cache file that Sass uses. You can delete it but it will keep coming back every time you compile.
Once you go to production you can set Sass to not add any comments to your final css output file. You do this through a config.rb file if you are using compass.
Search on YouTube for LevelUp Tuts and Sass Compass install. Scott expanse how to get stared very well.
--sourcemap=none will disable the comment as well as the .map file creation. not so hard guys.
also, --no-cache will prevent creating the .sass-cache folder and its content.
Thanks anyway.
Try using SassBuilder for ST2. And you can config not to include comments, cache,etc with True/False.
{
"output_path": "../css",
"options": {
"cache": true,
"debug": false,
"line-comments": true,
"line-numbers": true,
"style": "nested"
}
}
For further info, click here.
Is there a way to configure SASS FileWatcher so it builds a Minified CSS?
I currently configured SASS + YUI Compressor to accomplish this but I would like to do this with pure SASS if possible.
Here are the screenshots of both configurations:
SASS
YUI Compressor CSS
Thanks in advance.
Probably the fastest way to achieve this is to use the compressed option, mentioned in the previous comments, as an argument. The quickest way to configure this in PHPStorm is as follows:
Go to File > Settings
Inside Project Settings select File Watchers
You should already have an SCSS watcher created here (if you have the SCSS watch plugin enabled, PHPStorm prompts you to create a watcher when opening a new .scss file.) Otherwise, enable it (more info about that in this section of the official documentation,) and then create the new watcher pressing the "+" symbol.
Double click the watcher name to access its configuration.
In the Arguments line make sure to add the --style compressed argument
Click OK and you're done
This image shows how that configuration should look:
From that point on, your .css output files will be compressed.
The correct answer is --style=compressed
menu File -> Settings -> Tools - File watchers
add scss and in argument add --style=compressed
If you are using sassc under Linux (Arch) you could use as Arguments:
-t compressed -m auto $FileNameWithoutExtension$.scss $FileNameWithoutExtension$.min.css
For me, --style compressed, --style compressed and --style=compressed don't work.
I had to add the option -x as an argument.
Like here:
If you want more details this post the following post is where I found this solution: https://stackoverflow.com/a/25579991/9861577.
I have a Django 1.4 project, running on Python 2.7 in which I'm using Dajaxice 0.5.4.1. I have set it up on my development machine (Windows 7) and everything works perfectly. However when I deploy my app to production server (Ubuntu 12.04) I get 404 error for dajaxice.core.js file and cannot resolve this problem no matter what. Production server works with exactly the same versions of all software.
My project structure looks like this:
/myproject
/myproject/myproject-static/ <-- all the static files are here
/myproject/myproject-static/css/
/myproject/myproject-static/img/
/myproject/myproject-static/js/
/myproject/templates/
/myproject/myproject/
/myproject/main/
/myproject/app1/
/myproject/app2/
/myproject/app3/
etc.
I was following the Dajaxice installation steps here and put everything in its place (in settings.py, ˙urls.pyandbase.html` files).
My settings.py file has also these values:
from unipath import Path
PROJECT_ROOT = Path(__file__).ancestor(3)
STATIC_ROOT = ''
STATIC_URL = '/myproject-static/'
STATICFILES_DIRS = (
PROJECT_ROOT.child('myproject-static'),
)
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
'dajaxice.finders.DajaxiceFinder',
)
DAJAXICE_MEDIA_PREFIX = "dajaxice"
DAJAXICE_DEBUG = True
I have an Alias directive in my django.conf file which looks like this:
Alias /myproject-static/ "/path/to/myproject/myproject-static/"
I did collectstatic on my production server and got all static files collected within few folders in the root of my project. So, now when I look at my deployed web site, I can see that CSS is properly applied, JavaScript is working fine and navigation around the site works as intended. Everything is fine except Ajax is totally broken since dajaxice.core.js is never included.
My project folder structure after collecting static looks like this:
/myproject
/myproject/myproject-static/ <-- all the static files are originally here
/myproject/myproject-static/css/
/myproject/myproject-static/img/
/myproject/myproject-static/js/
/myproject/templates/
/myproject/admin/ <-- folder created with 'collectstatic' command
/myproject/css/ <-- folder created with 'collectstatic' command
/myproject/dajaxice/ <-- dajaxice.core.js is located here
/myproject/django_extensions/ <-- folder created with 'collectstatic' command
/myproject/img/ <-- folder created with 'collectstatic' command
/myproject/js/ <-- folder created with 'collectstatic' command
/myproject/myproject/
/myproject/main/
/myproject/app1/
/myproject/app2/
/myproject/app3/
etc.
Am I doing something completely wrong with my static files here?
What else should I try to fix this simple error?
Have you check if as the rest of the assets, dajaxice.core.js is inside your static/dajaxice folder? If not, the issue could be related with a miss configuration of the STATICFILES_FINDERS, check Installing dajaxice again
Another usual issue with collectstatic and dajaxice is to run the first using --link Are you using this option?
Hope this helps
I spend several hours grappling with this problem. It was crazy because everything worked great on my dev environment, but not on the test server even though all the dajax and dajaxice settings were on a common base settings file. I never got it to work using the standard route. But this is a very easy fix:
1) Download dajaxice.core.js into whatever static directory pleases you. You can find the js in your the dajaxice directory in your project root:
project/dajaxice/dajaxice.core.js
In my case, I put the file in static/js alongside all my other js libraries.
2) On your web page, replace this:
{% dajaxice_js_import %}
with a normal, everyday link to the js library. In my case:
<script src="/static/js/dajaxice.core.js" type="text/javascript"></script>
Unfortunately, this patch only works for developed code. If you usedo it in the development environment, new dajaxice code will be registered in the original project/dajaxice/ location and so the file will have to be copied to static after any new code is developed.