Question

Instead of a *.cs code behind or beside I'd like to have a *.js file. I'm developing a MVC application an have no need for a code beside because I have controllers, but in certain cases it'd be nice to have a JavaScript code beside or some way to associate the file to the page it's being used on. I suppose I could just name them similarly, but I'm wanting to show the association if possible so there's no question about what the file is for.

Typically what I'm talking about is within Visual Studio now under your Global.asax file you will have a plus sign to the left:

+ Global.asax

Once you expand it you'll get

- Global.asax
    Global.asax.cs

I'd like the same thing to happen:

+ Home.spark

- Home.spark
    Home.spark.js

Updated:

My existing csproj file has a path to the actual file, not sure if that's screwing it up. I've currently got:

<ItemGroup>
    <Content Include="Views\User\Profile.spark.js">
      <DependentUpon>Views\User\Profile.spark</DependentUpon>
    </Content>
  </ItemGroup>
  <ItemGroup>
    <Content Include="Views\User\Profile.spark" />
  </ItemGroup>

and it's simply just showing the files besides each other.

Was it helpful?

Solution

Absolutely - but you'll have to edit the project file by hand. Find your "child" file's entry, and change it to be a non-self-closing element, and add a child element to say what it depends on. Here's an example for a .cs file being compiled:

<Compile Include="AssertCount.cs">
  <DependentUpon>MoreEnumerable.cs</DependentUpon>
</Compile>

And here's a version I've just mocked up for the files you've specified - although I expect Home.spark will have an action associated with it rather than "None":

<ItemGroup>
  <Content Include="Home.spark.js">
    <DependentUpon>Home.spark</DependentUpon>
  </Content>
</ItemGroup>
<ItemGroup>
  <None Include="Home.spark" />
</ItemGroup>

Visual Studio displays it just as you'd expect it to.

OTHER TIPS

There is VSCommands add-in which allow you to configure dependant files directly from IDE

Link updated, previous was http://mokosh.co.uk/vscommands

FYI: When VSCommands is installed, just select all the files you want to be Dependant and the root file, then Right Click -> Group Items... and VSCommands will ask which of the files you would like to be the root file.

I don't know how you can do it via the Visual Studio UI itself, but if you open the csproj file in a text editor, you can see how they do it for Global.asax.

It usually looks something like this:

<Compile Include="Global.asax" />
<Compile Include="Global.asax.cs">
    <DependentUpon>Global.asax</DependentUpon>
</Compile>

Whilst the other solutions here (editing the project file) work for individual files, we've done the same thing, but want it to work automagically for all *.conv and *.conv.js files rather than having to edit the project file for each one.

When we add a new .conv file to our app, if we have a *.conv.js file it automatically nests under it as you'd expect with .aspx and *.aspx.cs.

I can't find the original tutorial I used to set this up (it does involved registry hacking) but here is one I found from a Google search just now that describes the same thing:

http://blog.dotnetwise.com/2009/09/visual-studio-2008-custom-nested-files.html

If you need to add code-behind for some file there is a workaround. For instance you want to make Test.xaml.cs a child of Test.xaml. Complete the following steps:

  1. Exclude both Test.xaml and Test.xaml.cs from project, save project.

  2. Unload project.

  3. Reload project.

  4. Click "Show hidden files" in File Explorer pane.

  5. File Test.xaml.cs will be displayed as child of Test.xaml.

  6. Add files back to project, save project.

That's it. Now Test.xaml.cs is dependent on Test.xaml.

You can edit by hand the project file, has John Skeed suggested, or you can also have a look on the File Nesting Extension for Visual Studio that will do the job for you.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top