I'm in a situation where I legally have to add a copyright notice to the top of my files and while I know how I can comment inside either template, script or style, I couldn't find documentation regarding how to do it outside these.
Based on the structure of the file, I assume the standard HTML comment (<!-- Hi there! -->) should work, and it both: a.) seems to work and b.) my syntax highlighter accepts it.
However, I'd like to be sure about it and understand how and why it works this way, I was surprised it is seemingly not covered in the Vue docs.
Yep, you are right. There is a confirmation here: https://vue-loader.vuejs.org/spec.html#src-imports
Related
Sorry to leave this question here, but I can't find the solution anywhere else.
On HTML Tag
When I type # on any HTML Tag, it popsup.
But, on a Vue Tags like for example or others built in components, that, doesn't show.
On Vue Tag
There's a configuration to do so?
Anybody can help?
It's on a Vue3 with Volar.
Sorry for my poor english, it's my seconded language.
I'm developing a Vue app using UI Kit which implies using various custom attributes like uk-grid, uk-icon, uk-navbar etc (in Vue single file components' templates). For each one, IntelliJ gives me a warning like
Warning:(7, 52) Attribute uk-icon is not allowed here
How can I tell IntelliJ not to do this? Googling the warning haven't brought any sane results which makes me think there's no ready-to-use package for this (for this particular UI Kit), so the question is: how to make Idea not to warn about a custom list of attributes? But I'll be glad to be wrong and if there is a better solution, please let me know.
Update: like lena has suggested, pressing alt+enter suggests helpful options, including adding attribute to the list of custom attributes. However, wildcard suggestion didn't work for me: the below screenshot illustrates settings that make v-localize attrbute be recognized, but uk--prefixed attribute are still highlighted with warning:
You can add uk-* attributes to Custom HTML tag attributes list in HTML | Unknown HTML tag attribute inspection; the easiest way to do this is using Add to custom HTML attributes quickfix available on Alt+Enter:
Note that IDEA recognizes Vuikit components and directives out of the box - did you consider using it instead of pure UIKit?
In their examples on github, and in other places, react-i18next seem to suggest that we should use their Trans component by filling it with some kind of text, which to my understanding does not appear in the resulting app in any way since it gets overwritten by the default locale. What's it for? Is it just there to make sure react doesn't optimize away the components?
An old question, but this fantastic resource here really helped me wrap my head around the <Trans /> component.
So after doing some more research, and trying a few suggestions, it seems that the recommended way to use <Trans> is to use the default text as a key in your autogenerated translation files, so
<Trans>Lorem ipsum</Trans>
in your code would give you
{"Lorem ipsum": "Lorem ipsum"}
in your default locale file, which could then be translated like
{"Lorem ipsum": "Löksås yxskaft"}
I am trying to create some composition but I am not getting anything I'd expect. In almost every instance I've tried a similar setup I get something different which is wrong so this GistRun is representative only as far as it illustrates that at least "something" is wrong.
I've searched high and low for more information on the specific functionality and syntax of compose but I can't seem to solve the issues.
In the before mentioned GistRun you can see that the Container element is not rendered correctly, the h1 is not rendered and that #containerless is being ignored.
In similar scenarios I've had containerless ignored on the compose element resulting in the rendering being ignored and I've had the entire thing not working with named slots.
I have a feeling that I'm doing something wrong and I can't quite figure out what it is. If someone knows what I'm doing wrong or can point me to a solution I would be much obliged.
Part of the reason things aren't working as you expect is that your gist is based off of a very old version of the framework. I've updated your gist to the latest version of Jeremy Danyow's Aurelia bundle here: https://gist.run/?id=1b304bb0c6dc98b23f4a3994acc280e4 The old version of the framework you were using in your gist still used the content element for content projection.
There are a couple of reasons your gist wouldn't run (aside from what I mentioned above). First, the compose element (and any custom elements you create) are not self-closing. This is per the Custom Element spec. So <compose view="test.html" /> wont' work. Second, there is an existing issue regarding containerless elements being used with content projection. After talking with the team, this issue is unlikely to be resolved as containerless custom elements aren't really supported by the Shadow DOM v1 spec. If you remove the containerless attribute from the compose element, your demo works. Finally, you forgot to add <require from="container"></require> at the top of your app.html file. Thus Aurelia was unaware that <ck-container> is an Aurelia custom element. Unless you have globally registered a custom element (or any other view resource), you MUST require it in to any view where you wish to use it.
Now, let's discuss the use of containerless. The containerless decorator and attribute shouldn't be used simply to "clean up" your HTML. They should only be used when absolutely necessary to achieve your goals. "Making my HTML pretty" is never absolutely necessary. When you use containerless you are creating a custom element that likely cannot ever be used as a standard custom element. Again, the Aurelia team discourages you from using containerless elements unless necessary.
An example of a valid reason to use containerless is expained in our documentation here: http://aurelia.io/hub.html#/doc/article/aurelia/framework/latest/cheat-sheet/4
I was experimenting with Dojo and Dijit in the past days and I find it quite interesting. I was however trying to find a reference or an API doc that helps me understand all the properties I can assign to widgets and containers.
For example a Tab with a Save Icon will be like this:
<div data-dojo-type="dijit.layout.ContentPane" title="Group Two" data-dojo-props="iconClass: 'dijitEditorIcon dijitEditorIconSave'">
Now, where can I find what to put in the "data-dojo-props" property? Where can I find for example all the list of icons?
My main question would be for example on how to create a vertical menubar, but beyond odd examples scattered here and there, the api reference is not much helpful...
Any help? Am I missing something here?
For this kind of situation, the trick is learning how to convert between the programmatic Javascript style and the declarative HTML style (and sometimes also between the old declarative style, without data).
For the new declarative style, basically the only "real" argument now is data-dojo-props and it consists of an object that will be passed to the widget constructor.
//programatic style
new dijit.myWidget({foo:'a', bar:'b'});
//declarative style
<div data-dojo-type="dijit.myWidget" data-dojo-props="foo:'a', bar:'b'"></div>
You can find what properties an widget accepts by checking the corresponding widget documentation and looking for either declarative or programmatic examples (now that we know how to convert between them). If that is not enough, you can also check the source code - it is usually very well commented and is where api.dojotoolkit.org gets its data from anyway.