I am running PhpStorm 2016.3.2 (I believe it is the current latest).
Since I've updated to this version, css files are always grouped / nested under their scss source files in the project tree, regardless if I have a SCSS watcher or not.
I've tried creating a completely empty new project, with no file watchers whatsoever, and manually created two files: test.scss and test.css. Immediately, the test.css got grouped under the test.scss.
Furthermore (in another project), I am using a custom transpiler, which creates a x.html file for each x.scss file in addition to the x.css file. However, no matter what I set in the Output paths to refresh field, PhpStorm will always group the CSS file, and only the CSS file under the SCSS node.
I am trying to make it also group the HTML file under that node, but ideally I want to know why is it doing any grouping at all when there are no file watchers?
I do want to point out that this was NOT an issue in the previous version.
Is there some hidden setting I am missing, is it a bug or is it a mandatory new "feature"?
Is there some hidden setting I am missing,
No.
is it a bug or is it a mandatory new "feature"?
It's a new feature -- file nesting no longer relies on presence of File Watcher (and the need to run it to have files actually nested).
At the moment it's implemented as hard-coded list of rules which you cannot modify (but you may try and suggest other rules and why they will be good).
UPDATE: The list of nesting rules is fully customizable since 2017.2 version. You can access those rules via cog icon in Project View panel where you may add your own or even disable such nesting.
Related
I am using Microsoft's VS Code to edit css, html and ts files that are shared by my team on a VSTS Git repo. However, my VS Code keeps removing empty/whitespaces that my colleagues added when I save any change (Image below) and this screws up the whole Git Diff part, as almost every single line of code shows as a diff.
I tried to disable every single config setup but nothings works:
At the end, what was causing my problem was the extension: EditorConfig for VS Code
This plugin attempts to override user/workspace settings with settings
found in .editorconfig files. No additional or vscode-specific files
are required. As with any EditorConfig plugin, if root=true is not
specified, EditorConfig will continue to look for an .editorconfig
file outside of the project.
I believe, it was overriding the options I selected inside of VS Code (such as files.trimTrailingWhitespace: false). So, no setup change I was making was actually being applied.
It seems you have trailing whitespace enabled in User Preferences too.
I'd suggest opening your configuration file of VSCode using
CtrlShiftP or
CmdShiftP in Mac and then go to Open User Settings.
I'm sure the next line is around there somewhere, delete it or change it to false.
files.trimTrailingWhitespace": true
In my case, the JS-CSS-HTML Formatter extension from lonefy
caused the problem.
Editor › Comments: Ignore Empty Lines
——>choose ：false
I opened my project on another computer, and the files where I'd been using a file watcher were expanded, like before they used to be nested like home.scss is now after I run the watcher once on that file.
Is there a way to automatically make all the files be nested?
Because when adding new files and folder with git, it would be quite troublesome to go into each and every file in order to make them become nested.
Like I have some minified JavaScript files that used to be nested, but now is expanded for some reason.
Hope you understand. Thank you.
Edit: Nested***
Is there a way to automatically make all the files go under a caret like that?
Unfortunately not. Such nesting information (to "go under a caret" as you are saying) is taken from "Output path to refresh" field of the corresponding File Watcher.
You have to run file watcher for such files at least once in order to see files nested like you have it on your another computer.
Here is how you can run File Watchers manually without the need to modify those files (so no extra history will appear in your git (or whatever VCS you may be using there)).
https://stackoverflow.com/a/20012655/783119
P.S.
In PhpStorm 2016.3 (the next version that will be released in 1.5-2 months or so) such nesting will be done automatically (the most common combinations) so there will be no need to have File Watchers for providing such info.
If you wish -- you can try EAP build right now (EAP means Early Access Program .. which is sort of Alpha/Beta builds (simply speaking).. and therefore some bugs for new functionality might be present and performance may not be optimal).
Any web project consists of lots of partials that are included into the main file. Very often IDE (PhpStorm for my case) doesn’t know where the including partial resides. The thing is sometimes we use absolute path (e.g. in AngularJS to specify where views’ or directive’s templates reside) and relative path in preprocessors’ sources (jade, stylus, coffee, etc.). And all these files can be stored somewhere in the folder structure.
Therefore very often you can’t to open the including file right from the main file using Ctrl+B.
I think there is a way to tell IDE where this file actually resides. Does anybody know how to cope with it?
If there is no way, I suppose we should ask the developer to solve it somehow.
Depending on the particular framework in which you're developing, a PhpStorm plugin might exist to make CTRL+B navigation possible. For instance, using the Symfony plugin (installed via Settings > Plugins), CTRL+B navigation into a partial template becomes possible in code like this:
return $this->render('hello/world/index.html.twig');
If a plugin is not available, try the following steps. It's not a perfect solution, but it's better than nothing! It's also extremely quick once you get the hang of it.
With your cursor inside the string containing the path and filename, use the 'Extend Selection' keyboard shortcut until the entire string is highlighted (excluding any wrapping single/double quotes). If you don't currently have the 'Extend Selection' action mapped, you can do so via Settings > Keymap.
Immediately use the 'Navigate to File' shortcut (CTRL+SHIFT+N) to search for all files matching the path/filename contained in the string you previously highlighted.
A dropdown box will appear containing all matching files. Find the proper one and open it using ENTER.
As far as I know, the only way to include a folder in an Air package (in Flash Pro, not Builder) is through the GUI:
Publish Settings > Player Settings > General Tab > Included Files
... but it's kind of a huge hassle to manually add and remove folders over and over again if you have to publish the app with a dozen different versions of the content, you know?
Is there a way to conditionally include folders based on text somewhere - the app config xml, maybe? or something else that will be checked when the APK is compiled? That way I could just copy and paste in the folder name to switch which asset folder is being included, instead of going through the whole process inside of the flash IDE?
This idea might possibly be of some use although it could require some management due to possibly meaning you have duplicated assets.
I typically store all my assets inside an 'includes' folder/directory and just add this to the Settings > Include Files pane.
I also have folders which store the target specific includes, such as 'IOS' and 'ANDROID', (but aren't added to the Include Files pane).
When publishing, I swap out the contents of the includes folder. So it's just a case of deleting the existing contents if the includes folder and copy/pasting from the relevant source folder into the includes folder.
Hope that makes sense.
There are a couple of things you could do, though they're not 100% solutions per se.
1) Use conditional compilation:
Depending on how your imports/includes are set up, you could change it to always be the same file, but change the code/embed inside depending on a compile time constant. You can add a compile constant by going to File > Publish Paramaters > Flash (tab) > Parameters > Configure Constants:
Your constants would be in the form CONFIG::debug or FOO::bar, then in code, you wrap your code like this:
CONFIG::debug
{
// code is only included if CONFIG::debug is true at compile time
}
Then, by flipping constants, you can include or exclude blocks of code. There's a bit more detail here: http://divillysausages.com/blog/as3_conditional_compilation
NOTE: this is much easier to do in an IDE like FlashDevelop.
2) Use an external IDE
Taking the FlashDevelop example, when building for mobile, a number of .bat files are created. Depending on the environment vars set, you can include/exclude folders as you wish. I do this to include different assets depending on if it's a desktop, Android, or iOS build.
3) Use the Flex SDK command line or ANT
With either of these, you can specify a config.xml file for the files that you want to include. External IDEs (like FD) use the command line directly, so you can almost copy/paste the command if necessary.
For ANT, it's not my strongest point, but you can find out a bit more here: http://charlespatricknewman.com/blog/?p=325
When I try to click on some function in PhpStorm with a CRTL button the system tries to bring me to a definition of this function. Sometimes there are multiple definitions and the annoying page shows up telling to chose to which definition you want to go. Like here:
Because I am using grunt and minifing / concatenating results, the definitions is in multiple places. I know that I should ignore everything in node_modules, but the system does not. Is there a way for me to exclude some of the folders?
If you don't need any completion/navigation/etc. from your local node_modules, you can exclude this folder from your project:
right-click, Mark directory as/Excluded
You will still be able to run Grunt, but files in these folders won't be indexed and thus suggested for completion/navigation