Skip to content

Cannot have colocated javascript when using typescript and asp.net razor pages app. #41921

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
1 task done
solrevdev opened this issue May 30, 2022 · 5 comments
Closed
1 task done
Labels
area-blazor Includes: Blazor, Razor Components feature-static-web-assets ✔️ Resolution: Duplicate Resolved as a duplicate of another issue Status: Resolved

Comments

@solrevdev
Copy link

solrevdev commented May 30, 2022

Is there an existing issue for this?

  • I have searched the existing issues

Describe the bug

I have a dotnet new razor project with Microsoft.TypeScript.MSBuild and BuildBundlerMinifier added so that I can write TypeScript first, then minify the compiled JavaScript further

So, I want to be able to write the source TypeScript in the folder next to where I want the compiled JavaScript output file to eventually be.

So for example:

input: src/Web/wwwroot/js/site.ts    # source code
output: src/Web/wwwroot/js/site.js   # compiled via typescript
then: src/Web/wwwroot/js/site.js.min # minified via bundleconfig.json

Also,

input: src/Web/Pages/Admin/Quotes/Index.cshtml.ts     # source code
output src/Web/Pages/Admin/Quotes/Index.cshtml.js     # compiled via typescript
then: src/Web/Pages/Admin/Quotes/Index.cshtml.js.min  # minified via bundleconfig.json

The project will build initially, but any subsequent builds or a dotnet watch will then fail.

The build output and error is as follows:

# first build will succeed as it creates the files as expected
dotnet build
Microsoft (R) Build Engine version 17.2.0+41abc5629 for .NET
Copyright (C) Microsoft Corporation. All rights reserved.

  Determining projects to restore...
  All projects are up-to-date for restore.

  Bundler: Begin processing bundleconfig.json
    Minified wwwroot/css/site.min.css
    Minified wwwroot/js/site.min.js
    SourceMap wwwroot/js/site.min.js.map
    Minified Pages/Admin/Quotes/Index.cshtml.min.js
    SourceMap Pages/Admin/Quotes/Index.cshtml.min.js.map
  Bundler: Done processing bundleconfig.json
  dotnetissue -> /Users/solrevdev/Desktop/dotnetissue/bin/Debug/net6.0/dotnetissue.dll

Build succeeded.
    0 Warning(s)
    0 Error(s)

Time Elapsed 00:00:07.39

## then any subsequent files will fail

dotnet build
Microsoft (R) Build Engine version 17.2.0+41abc5629 for .NET
Copyright (C) Microsoft Corporation. All rights reserved.

  Determining projects to restore...
  All projects are up-to-date for restore.

  Bundler: Begin processing bundleconfig.json
  Bundler: Done processing bundleconfig.json
/usr/local/share/dotnet/sdk/6.0.300/Sdks/Microsoft.NET.Sdk.Razor/targets/Microsoft.NET.Sdk.Razor.JSModules.targets(105,5): error : Two assets found targeting the same path with incompatible asset kinds:  [/Users/solrevdev/Desktop/dotnetissue/dotnetissue.csproj]
/usr/local/share/dotnet/sdk/6.0.300/Sdks/Microsoft.NET.Sdk.Razor/targets/Microsoft.NET.Sdk.Razor.JSModules.targets(105,5): error : '/Users/solrevdev/Desktop/dotnetissue/Pages/Admin/Quotes/Index.cshtml.js' with kind 'All' [/Users/solrevdev/Desktop/dotnetissue/dotnetissue.csproj]
/usr/local/share/dotnet/sdk/6.0.300/Sdks/Microsoft.NET.Sdk.Razor/targets/Microsoft.NET.Sdk.Razor.JSModules.targets(105,5): error : '/Users/solrevdev/Desktop/dotnetissue/Pages/Admin/Quotes/Index.cshtml.js' with kind 'All' [/Users/solrevdev/Desktop/dotnetissue/dotnetissue.csproj]
/usr/local/share/dotnet/sdk/6.0.300/Sdks/Microsoft.NET.Sdk.Razor/targets/Microsoft.NET.Sdk.Razor.JSModules.targets(105,5): error : for path 'Pages/Admin/Quotes/Index.cshtml.js' [/Users/solrevdev/Desktop/dotnetissue/dotnetissue.csproj]

Build FAILED.

/usr/local/share/dotnet/sdk/6.0.300/Sdks/Microsoft.NET.Sdk.Razor/targets/Microsoft.NET.Sdk.Razor.JSModules.targets(105,5): error : Two assets found targeting the same path with incompatible asset kinds:  [/Users/solrevdev/Desktop/dotnetissue/dotnetissue.csproj]
/usr/local/share/dotnet/sdk/6.0.300/Sdks/Microsoft.NET.Sdk.Razor/targets/Microsoft.NET.Sdk.Razor.JSModules.targets(105,5): error : '/Users/solrevdev/Desktop/dotnetissue/Pages/Admin/Quotes/Index.cshtml.js' with kind 'All' [/Users/solrevdev/Desktop/dotnetissue/dotnetissue.csproj]
/usr/local/share/dotnet/sdk/6.0.300/Sdks/Microsoft.NET.Sdk.Razor/targets/Microsoft.NET.Sdk.Razor.JSModules.targets(105,5): error : '/Users/solrevdev/Desktop/dotnetissue/Pages/Admin/Quotes/Index.cshtml.js' with kind 'All' [/Users/solrevdev/Desktop/dotnetissue/dotnetissue.csproj]
/usr/local/share/dotnet/sdk/6.0.300/Sdks/Microsoft.NET.Sdk.Razor/targets/Microsoft.NET.Sdk.Razor.JSModules.targets(105,5): error : for path 'Pages/Admin/Quotes/Index.cshtml.js' [/Users/solrevdev/Desktop/dotnetissue/dotnetissue.csproj]
    0 Warning(s)
    1 Error(s)

Time Elapsed 00:00:05.50

The repo is here : https://github.com/solrevdev/dotnet-ts-colocation-issue

Expected Behavior

No response

Steps To Reproduce

The project should build unless I am missing something obvious, which is very possible!

The repo is here : https://github.com/solrevdev/dotnet-ts-colocation-issue

Exceptions (if any)

No response

.NET Version

6.0.300

Anything else?

I am using a combo of Sublime Text and VS Code Insiders

And here is some environment information:

.NET

dotnet --info
.NET SDK (reflecting any global.json):
 Version:   6.0.300
 Commit:    8473146e7d

Runtime Environment:
 OS Name:     Mac OS X
 OS Version:  11.6
 OS Platform: Darwin
 RID:         osx.11.0-x64
 Base Path:   /usr/local/share/dotnet/sdk/6.0.300/

Host (useful for support):
  Version: 6.0.5
  Commit:  70ae3df4a6

.NET SDKs installed:
  3.1.419 [/usr/local/share/dotnet/sdk]
  6.0.300 [/usr/local/share/dotnet/sdk]

.NET runtimes installed:
  Microsoft.AspNetCore.App 3.1.25 [/usr/local/share/dotnet/shared/Microsoft.AspNetCore.App]
  Microsoft.AspNetCore.App 6.0.5 [/usr/local/share/dotnet/shared/Microsoft.AspNetCore.App]
  Microsoft.NETCore.App 3.1.25 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App]
  Microsoft.NETCore.App 6.0.5 [/usr/local/share/dotnet/shared/Microsoft.NETCore.App]

To install additional .NET runtimes or SDKs:
  https://aka.ms/dotnet-download

macOS:

neofetch --off
[email protected]
------------------------------
OS: macOS 11.6.6 20G624 x86_64
Host: Macmini7,1
Kernel: 20.6.0
Uptime: 3 hours, 14 mins
Packages: 323 (brew)
Shell: zsh 5.8
Resolution: 2560x1440
DE: Aqua
WM: Quartz Compositor
WM Theme: Blue (Light)
Terminal: iTerm2
Terminal Font: CaskaydiaCoveNerdFontComplete-Regular 16
CPU: Intel i5-4278U (4) @ 2.60GHz
GPU: Intel Iris
Memory: 9128MiB / 16384MiB
@javiercn javiercn added area-blazor Includes: Blazor, Razor Components feature-static-web-assets labels May 30, 2022
@javiercn
Copy link
Member

javiercn commented May 30, 2022

@solrevdev thanks for contacting us.

The likely case for this is that you are not integrating your build pipeline with static web assets. The first build happens without the content being present and the content gets generated.

The second time the build happens the content is already there, so it gets detected and when you do the build, it gets added again, so it gets duplicated.

The best way to solve this is to put some code in your project file to make sure static web assets is able to pick up your content.

<PropertyGroup>
  <PrepareForBuildDependsOn><<your-targets>>;$(PrepareForBuildDependsOn)</PrepareForBuildDependsOn>
</PropertyGroup>

Should make your targets run early enough to prevent this from happening.

@javiercn
Copy link
Member

We do have designs to make this integration easier in a future release here so we are closing this issue as a dupe as we are keeping track on the mentioned issue.

@javiercn javiercn added the ✔️ Resolution: Duplicate Resolved as a duplicate of another issue label May 30, 2022
@ghost ghost added the Status: Resolved label May 30, 2022
@solrevdev
Copy link
Author

solrevdev commented May 30, 2022

@javiercn Thanks for replying.

I assume there is a typo there somewhere as I get

dotnet build
Microsoft (R) Build Engine version 17.2.0+41abc5629 for .NET
Copyright (C) Microsoft Corporation. All rights reserved.

dotnetissue.csproj(18,32): error MSB4025: The project file could not be loaded. Name cannot begin with the '<' character, hexadecimal value 0x3C. Line 18, position 32.

Build FAILED.

/Users/solrevdev/Desktop/dotnetissue/dotnetissue.csproj(18,32): error MSB4025: The project file could not be loaded. Name cannot begin with the '<' character, hexadecimal value 0x3C. Line 18, position 32.
    0 Warning(s)
    1 Error(s)

Time Elapsed 00:00:00.07

@javiercn
Copy link
Member

@solrevdev You need to replace <<your-targets>> with the targets your tools use to generate the content.

@solrevdev
Copy link
Author

solrevdev commented May 30, 2022

@solrevdev You need to replace <<your-targets>> with the targets your tools use to generate the content.

Sorry I'm really not sure I understand, I don't set any targets or use any tools.

Well no, that's not true, I do include TypeScript and BuildBundlerMinifier perhaps you mean these?

  <PackageReference Include="BuildBundlerMinifier" Version="3.2.449" />
  <PackageReference Include="Microsoft.TypeScript.MSBuild" Version="4.7.2">

Aha, OK, So, I've got it to build consistently by adding something I copied from another one of your replies to another issue.

It works, but I'm not that confident I fully understand what is going on.

<PropertyGroup>    
    <PrepareForBuildDependsOn>GetTypeScriptOutputForPublishing;$(PrepareForBuildDependsOn)</PrepareForBuildDependsOn>  
</PropertyGroup>

So my .csproj in full is:

<Project Sdk="Microsoft.NET.Sdk.Web">

  <PropertyGroup>
    <TargetFramework>net6.0</TargetFramework>
    <Nullable>enable</Nullable>
    <ImplicitUsings>enable</ImplicitUsings>
  </PropertyGroup>

  <ItemGroup>
    <PackageReference Include="BuildBundlerMinifier" Version="3.2.449" />
    <PackageReference Include="Microsoft.TypeScript.MSBuild" Version="4.7.2">
      <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
      <PrivateAssets>all</PrivateAssets>
    </PackageReference>
  </ItemGroup>

  <PropertyGroup>    
    <PrepareForBuildDependsOn>GetTypeScriptOutputForPublishing;$(PrepareForBuildDependsOn)</PrepareForBuildDependsOn>  
  </PropertyGroup>
</Project>

Thanks for pointing me in the right direction, much appreciated.

solrevdev added a commit to solrevdev/dotnet-ts-colocation-issue that referenced this issue May 30, 2022
solrevdev added a commit to solrevdev/dotnet-ts-colocation-issue that referenced this issue May 30, 2022
@ghost ghost locked as resolved and limited conversation to collaborators Jun 29, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area-blazor Includes: Blazor, Razor Components feature-static-web-assets ✔️ Resolution: Duplicate Resolved as a duplicate of another issue Status: Resolved
Projects
None yet
Development

No branches or pull requests

2 participants