I don't see any intellisense for ReactJS, for example methods like React.createClass although I see _references.js file at the root folder. The _references.js file has help reference to various react js files.
The extension of my react file is JS and not JSX.
I fixed this issue by importing the NuGet package "react.js" and bringing the script locally.
I've also added a _references.js to ~/Scripts/ to my project. Visual Studio had a helper under "add..." entitled "_references.js intellisense file" which looked like this:
/// <autosync enabled="true" />
/// <reference path="bootstrap.js" />
/// <reference path="jquery-2.1.4.js" />
/// <reference path="react/jsxtransformer-0.13.1.js" />
/// <reference path="react/react-0.13.1.js" />
/// <reference path="react/react-with-addons-0.13.1.js" />
After that, I was able to use intellisense in my jsx files. The _references.js file did not seem to like running from Facebook's CDN.
Related
I'm using Visual Studio 2017. I used the asset generator to auto-generate icons for my app, but most of them look very bad. So, I thought to cut down on the number of icons, but now I can't find any option to remove an image from the Visual Assets listing. only adding/auto-generating them. Opening the associated Package.appxmanifest file doesn't show any of these images being even referenced. And without solving this problem, Visual Studio is not letting me even build the project >_<
So, I'd like to understand how to remove some of these images? Searching the microsoft forums, but haven't yet found anything related to "removing" assets,
Just delete the path to the file, ie Assets\SmallTile.png in Package.appxmanifest.
You cannot however remove all the assets since some sizes like splash screen or medium tile are required - you'll have to generate/add new.
Also make sure that these checkboxes are not checked for icons you've removed.
You need to undo in 3 steps:
Remove the Logo settings from Package.appxmanifest, but leave the required ones.
Open Assets folder, delete all auto-generated assets, again, leave the required ones.
Close your project, and open your .csproj file in notepad, delete the newly added referenced items - they look like below, and then save the csproj file.
<ItemGroup>
<Content Include="Assets\LargeTile.scale-100.png" />
<Content Include="Assets\LargeTile.scale-125.png" />
<Content Include="Assets\LargeTile.scale-150.png" />
<Content Include="Assets\LargeTile.scale-200.png" />
<Content Include="Assets\LargeTile.scale-400.png" />
<Content Include="Assets\SmallTile.scale-100.png" />
<Content Include="Assets\SmallTile.scale-125.png" />
<Content Include="Assets\SmallTile.scale-150.png" />
...
I'm new to Typescript and have been working the last few days within Visual Studio 2013 Update 2 (which natively includes all support).
I have the following options selected within Visual Studio on the properties page for my project.
This means that when I save a file it will automatically compile all the typescript files together and create a single RRStore.js file. I then just include this using the BundleManager in ASP.NET as if it were any old JS file. I am not using a module loaders since there's not much JS code.
To resolve dependencies in the correct order the TS compiler needs a _references.ts file so I created one like this :
/// <reference path="RR.ErrorHandling.ts" />
/// <reference path="RR.JQueryPlugins.ts" />
/// <reference path="RR.Util.ts" />
/// <reference path="viewmodel/UserViewModel.ts" />
/// <reference path="viewmodel/AddressViewModel.ts" />
/// <reference path="viewmodel/ProductViewModel.ts" />
/// <reference path="viewmodel/CartItemViewModel.ts" />
/// <reference path="viewmodel/CheckoutViewModel.ts" />
/// <reference path="viewmodel/StoreWizardViewModel.ts" />
/// <reference path="viewmodel/DefenderWizardViewModel.ts" />
/// <reference path="viewmodel/MainViewModel.ts" />
/// <reference path="RR.YoutubeLoader.ts" />
This file means when I hit Ctrl+S within Visual Studio after editing a TS file it will combine all my other TS files together in this order so things such as prototype chains are correct for inheritance.
This was working fine on Ctrl+S when saving a TS file.
I then had to make a change to some C# code - after which of course I needed to hit Ctrl+F5 to build the project. To my surprise I got weird JS errors in the browser - about prototypes not existing on objects.
I looked at the generated Typescript file RRStore.js in the browser and examined the order of all my files and it's put the file RR.YoutubeLoader.ts FIRST.
That's weird! (not least because it's LAST on my list of references above.)
I went to that file and hit Ctrl+S, refreshed RRStore.js and everything is back in the right order.
In other words when I do a full build the order of files in _references.ts is not respected, but when I just hit Ctrl+S it is. What's going on?
Edit: Update: Turns out _references.ts needs to be in the root of your project to be recognized by the compiler. So that's the preferred way :-) This method works too... but please don't do this:
Original workaround:
When reading through my generated RRStore.js file I noticed the order seemed to be in an apparently random order: RR.YoutubeLoader, ProductViewModel, DefenderViewModel, StoreViewModel etc.
I realized there could be only one explanation....
I opened up the .csproj file and sure enough the compiler was processing files in the order they had been initially added to my project!!!.
So I moved the _references.ts file up to the first in the MySite.csproj file - and it is now correctly recognizing it and compiling everything in the right order.
I'm not sure if this is a known bug yet but that was an adequate solution for me.
MyProject.csproj
Sooooo....
Apparently _references.ts needs to be in the root of the project.
I haven't tested this but this is a response from https://typescript.codeplex.com/workitem/2592
I still prefer my way of manually editing the csproj file (so my ts files are all inside Scripts/Typescript). Hopefully sometime they'll change this unintuitive behavior and look for _references.ts wherever it is.
I couldn't find any reference to this in the typescript bug tracker, so I have created one at https://typescript.codeplex.com/workitem/2592
I am using Chutzpah in Visual Studio 2013 Update 2, and I am trying to do some unit testing using jasmine for AngularJS.
The problem is that for some reason chutzpan thinks my reference javascript files are files to test.
No matter where I include the reference files (in the test file or Chutzpah.json), I get the same errors.
For example, if I include:
/// <reference path="Scripts/angular.js" />
/// <reference path="Scripts/angular-mocks.js" />
/// <reference path="../codeToTest" />
describe('Controller: myController', function () {
beforeEach(module('myApp'));
});
I get:
Error: TypeError: 'undefined' is not an object (evaluating 'angular.mock = {}')
and
ReferenceError: Can't find variable: module in file.
Any ideas where I am wrong?
Thank you!
Update: So guys, I solve the problem just by adding reference files in both test files and chutzpah.json.
You have two choices here. You can either create a chutzpah.json file and include the references there, or you can change /// reference to /// chutzpah_reference
You can find more info here: https://chutzpah.codeplex.com/wikipage?title=Chutzpah%20File%20References
i have a jQuery plugin .js file, and a Typescript file in which i want to use the first plugin. after googling that, maybe i need import library.d.ts into my typescript file like following code, and how about that plugin(slof-slider.js)?
/// <reference path="jquery.d.ts"/>
After you have added the following line :
/// <reference path="jquery.d.ts"/>
You need to tell TypeScript about the functions added by SlofSlider (not sure about the name?) e.g. if you want :
$('div').slider();
to compile you would do something like:
interface JQuery {
slider: Function;
}
After adding this reference
/// <reference path="jquery.d.ts"/>
Add the jquery.min library to webpage... that should work fine..
Does anyone know of a good way to minify all js, css, etc. files as part of the publish process? I'm thinking, run a batch file that fires jmin? But not sure how to go about this?
You could use the .net ClientDependancy Framework to do this
Update
You start out by defining paths to the directories which contain the resources to manage, something like this:
<CD:ClientDependencyLoader runat="server" id="Loader">
<Paths>
<CD:ClientDependencyPath Name="Styles" Path="~/css" />
<CD:ClientDependencyPath Name="Scripts" Path="~/js" />
</Paths>
</CD:ClientDependencyLoader>
You then specify the files to manage in JS or CSS includes:
<CD:JsInclude ID="baseScript" runat="server" FilePath="~/js/baseScript.js" Priority="0" />
Don't forget to register the control at the top of the file:
<%# Register Namespace="ClientDependency.Core.Controls" Assembly="ClientDependency.Core" TagPrefix="CD" %>