Just started a fresh new React project, using WebStorm as my IDE.
Lets look at some type of material-UI typography 'varient' attribute:
For an unknown reason, WebStorm does not peek at these types:
('no suggestions' is written buy when I screenshot the message disappear)
VSCode auto-suggest with no problems on this union type:
What's going on? I know for sure that these sort of suggestions worked previously in WebStorm (I'm using latest version).
This is the code:
import { Typography } from "#mui/material";
function App() {
return (
<div className="App">
<Typography variant="">hello world, doing good?</Typography>
</div>
);
}
export default App;
WEB-53199 is fixed in the upcoming 2021.3.2 update
Related
I am trying to use monaco-editor in my ember app,
I am using
ember-monaco for that.
I followed the instructions and added in my application.hbs the following code:
{{code-editor
language="typescript"
code=sample1
onChange=(action (mut sample1))
theme="light"
onReady=(action editorReady)
}}
I am running the app, but the editor doesn't appear,
I get the following runtime error:
index.js:181 Uncaught Error: Assertion Failed: Action passed is null or undefined in (action) from (generated application controller).
at assert (index.js:181:1)
at makeClosureAction (index.js:738:1)
at makeDynamicClosureAction (index.js:727:1)
at index.js:679:1
at Object.evaluate (runtime.js:2084:1)
at AppendOpcodes.evaluate (runtime.js:1312:1)
at LowLevelVM.evaluateSyscall (runtime.js:5232:1)
at LowLevelVM.evaluateInner (runtime.js:5188:1)
at LowLevelVM.evaluateOuter (runtime.js:5180:1)
at VM.next (runtime.js:6191:1)
I removed the actions
{{code-editor
language="typescript"
code=sample1
theme="light"
}}
Now the editor appears but with out the sample code (since I deleted the relevant lines),
What is the correct syntax?
Ember version:
ember-cli: 3.28.5
node: 10.24.1
with ember-source#3.16+, it's recommend to directly reference actions / functions, like:
{{code-editor
language="typescript"
code=this.sample1
onChange=this.handleChange
theme="light"
onReady=this.editorReady
}}
(assuming handleChange and editorReady are defined your backing class) (also assuming you have a backing class)
When I go to view my SwiftUI through the canvas preview in Xcode 11.3.1 I am getting the error
Compiling failed: 'Color' is only available in iOS 13.0 or newer
But the project itself builds successfully and the simulator loads without any issues. I have tried clearing the build folder, quitting Xcode and rebuilding but still no luck.
Any help would be great. Thanks in advance.
SwiftUI minimum deployment target is 13.0, so if you have project with support of older version, then all SwiftUI code (including preview providers) you have to prepend with availability modifier, like
#available(iOS 13.0, *) // << here !!
struct Demo: View {
var body: some View {
VStack {
Text("Hello")
}
}
}
You Should use Assets or Other option like Color Literal for Color.
Don't use the system Color option since your deployment target is 11.4.
Man, I've had a similar issue. The problem was that sometimes my preview worked sometimes it didn't... I reviewed the diagnostics and realized that there are some #_dynamicReplacement attributes mentioned (which are used, I guess, for hot reloading). It wasn't working when I've had a file with #available attributes opened in the (adjacent) editor. When I closed that editor everything worked back again.
Magic ✨
Also one more hint from my friend - when you have a file from another target (not the one hosting your Canvas-related code) in (adjacent) editor it behaves the same way.
I'm doing some forms on my app and checking the ion-select component (https://ionicframework.com/docs/api/components/select/Select/), I realized that the ios version looks better than the android version. Is there a easy way to change the behavior so I can use the ios style on android/browser?
Yes, We can use select options for this. Take a look of the following code.
this.selectOptions = {
title: 'Pizza Toppings',
subTitle: 'Select your toppings',
mode: 'ios' // here we can specify our required platform
};
What are some good practices for loading a conditional javascript file using modernizr now that yepnope and .load are deprecated in the latest version of modernizr.
Used to be able to use the .load function.
http://modernizr.com/docs/#load
Modernizr.load({
test: Modernizr.geolocation,
yep : 'geo.js',
nope: 'geo-polyfill.js'
});
Now .load is deprecated along with yepnope.
https://github.com/SlexAxton/yepnope.js/
Reference for answer prior to yepnope being deprecated
Loading Scripts Using Modernizr... Not Working
You can use jQuery's getScript method. I think you could also use .fail instead of the else statement. Spent my morning figuring this out and have been trying to answer these to save people some time!
Something like this?
if (Modernizr.geolocation) {
jQuery.getScript("geo.js")
//it worked! do something!
.done(function(){
console.log('geo.js loaded');
});
} else {
jQuery.getScript("geo-polyfill.js")
//it worked! do something!
.done(function(){
console.log('geo-polyfill.js loaded');
});
}
I am trying to use Knockout external template plugin. Firefox stops in my util.js on this line: infuser.defaults.templateUrl = "/CAS/templates";
It complains that infuser is undefined. If I simply press continue in Firebug, the view loads and loads the template just fine. If I comment that line out, the template does not load and I get a file not found error. So that setting is working despite infuser is not defined. Here is the order stuff gets loaded.
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/external/jquery-{version}.js",
"~/Scripts/external/jquery-ui-1-10.2.js",
"~/Scripts/external/jquery.unobtrusive*",
"~/Scripts/external/jquery.validate*"));
bundles.Add(new ScriptBundle("~/bundles/knockout").Include(
"~/Scripts/external/knockout-{version}.js",
"~/Scripts/external/koExternalTemplateEngine_all.js",
"~/Scripts/local/utils.js",
"~/Scripts/external/knockout.mapping-latest.js"));
bundles.Add(new ScriptBundle("~/bundles/local").Include(
"~/Scripts/local/ajaxservice.js",
"~/Scripts/local/DMS.CAS.Dataservice.js",
"~/Scripts/local/DMS.CAS.ViewModel.js",
"~/Scripts/local/DMS.Models.js"));
Here is binding in the view:
<div data-bind="template: {name: 'HelloWorld'}"></div>
My jQuery version is 2.0.3, KO version is 2.3.0, and the KO External Template plugin was installed via nuGet 1 day ago. I have pursued this as problem with the order script files being loaded in the wrong order. But, that does not seem to be the case. Any help is appreciated.
You need to put infuser.js into Knockout bundle before koExternalTemplateEngine_all.js:
bundles.Add(new ScriptBundle("~/bundles/knockout").Include(
"~/Scripts/external/knockout-{version}.js",
"~/Scripts/external/infuser.js",
"~/Scripts/external/koExternalTemplateEngine_all.js",
"~/Scripts/local/utils.js",
"~/Scripts/external/knockout.mapping-latest.js"));