Typescript: VS2013u3 - Virtual Project errors TS1148, TS2307

[fis-cz]

TypeScript Version: 2.3. for Visual Studio 2015u3

---

Edit

My latest findings:

It seems the external tsconfig is not correctly interpreted with language service:
It seems that some msconfig options does not work in the same way as in case of external tsconfig.

As I am looking to both configs together, can't it be something related to letter case??

Test case:

   tsconfig.json
   mainmodule.csproj
   mainmodule (folder)
      index.ts - main module file
      submodule (submodule folder)
         dosomework.ts (some submodule local code referenced using relative path)
         index.ts (submodule main code)

Lets say there is following code in mainmodule.ts

   import * as submodule from "mainmodule/submodule";

When I have following, external tsconfig.json (out of other settings):

    "module": "amd",
    "moduleResolution": "node",
    "baseUrl": ".",

The compilation itself works well with no errors, but language service does not work as it is not able to resolve modules correctly. Does the baseUrl really working well under VS?

When I use msconfig with following options:

    <TypeScriptBaseUrl>.</TypeScriptBaseUrl>
    <TypeScriptModuleKind>AMD</TypeScriptModuleKind>
    <TypeScriptModuleResolution>Node</TypeScriptModuleResolution>

Both, compilation and language service are failing.

I would say this is very close to what I wrote before.

---

I have multiple WebApp with TS projects in VS solution. For each one I have separate tsconfig.json file in the root folder of the project. Some projects reports:

TypeScript Virtual Projects reports

Error   TS1148  Cannot use imports, exports, or module augmentations when '--module' is 'none'. 
Error   TS2307  Cannot find module 'ajsfw'. TypeScript Virtual Projects

but when I try to compile the project everything works correctly and correct output is generated.

It seems the language service is not using correct tsconfig.

the tsconfig extends another and that extends another one. its like that:

tsconfig.json

{ "compileOnSave": true, "extends" : "./tsconfig.Debug.json" } 

tsconfig.Debug.json

{
  // TypeScript 2.2 compiler configuration
  // DEBUG CONFIGURATION
  "$schema": "http://json.schemastore.org/tsconfig#",

  "extends": "./tsconfig.common.json",

  "compilerOptions": {
    // generate .d.ts declaration file
    "declaration": true,
    // generate source maps
    "sourceMap": true,
    // source map root
    "mapRoot": "/js",
    // sources root directory
    "sourceRoot": "/src/HelloWorld",
    // remove comments
    "removeComments": false
  }
}

tsconfig.common.json

{
  // TypeScript 2.2 compiler configuration
  // COMMON CONFIGURATION (DEBUG/RELEASE)
  "$schema": "http://json.schemastore.org/tsconfig#",

  "compilerOptions": {
    // output file (single js file will be generated)
    "outFile": "./bin/HelloWorld.js",
    // target ECMA version
    "target": "es5",
    // libs to be used during compilation
    "lib": [ "dom", "es2015.promise", "es5" ],
    // base url of shared bin folder
    "baseUrl": "../../../Ajs/bin/",
    // moule system to be used (none, AMD, CommonJS, UMD, System, ES2015)
    "module": "amd",
    // module resolution strategy
    "moduleResolution": "node",
    // don't emit any output when compilation fails
    "noEmitOnError": true,
    // don't emit BOM
    "emitBOM": false,
    // preserve const enums (don't delete from generated code)
    "preserveConstEnums": true,
    // implicit any
    "noImplicitAny": false,
    // allow experimental decorators feature
    "experimentalDecorators": true
  },
  "include": [
    "../../../Ajs.Lib.ts/bin/ajs.lib.ts.d.ts",
    "../../../Ajs/bin/**/*.d.ts",
    "./**/*"
  ],
  "exclude": [
    "./bin/**/*"
  ]
}

project.csproj (removed some content files):

<?xml version="1.0" encoding="utf-8"?>
<Project ToolsVersion="4.0" DefaultTargets="Build" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
  <Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.Default.props" Condition="Exists('$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.Default.props')" />
  <PropertyGroup>
    <Configuration Condition=" '$(Configuration)' == '' ">Debug</Configuration>
    <ProjectGuid>{A7219561-43EA-4176-A598-D0FD51715CA0}</ProjectGuid>
    <ProjectTypeGuids>{349c5851-65df-11da-9384-00065b846f21};{fae04ec0-301f-11d3-bf4b-00c04f79efbc}</ProjectTypeGuids>
    <OutputType>Library</OutputType>
    <OutputPath>bin</OutputPath>
    <TargetFrameworkVersion>v4.6.1</TargetFrameworkVersion>
    <DebugType>full</DebugType>
    <DebugSymbols>true</DebugSymbols>
    <TypeScriptToolsVersion>2.3</TypeScriptToolsVersion>
    <UseIISExpress>true</UseIISExpress>
    <IISExpressSSLPort />
    <IISExpressAnonymousAuthentication />
    <IISExpressWindowsAuthentication />
    <IISExpressUseClassicPipelineMode />
    <UseGlobalApplicationHostFile />
    <TargetFrameworkProfile />
  </PropertyGroup>
  <PropertyGroup>
    <VisualStudioVersion Condition="'$(VisualStudioVersion)' == ''">12.0</VisualStudioVersion>
  </PropertyGroup>
  <ItemGroup>
    <Service Include="{4A0DDDB5-7A95-4FBF-97CC-616D07737A77}" />
  </ItemGroup>
  <PropertyGroup>
    <RootNamespace>HelloWorld</RootNamespace>
  </PropertyGroup>
  <ItemGroup>
    <Content Include="tsconfig.json" />
    <None Include="tsconfig.common.json">
      <DependentUpon>tsconfig.json</DependentUpon>
    </None>
    <None Include="tsconfig.Debug.json">
      <DependentUpon>tsconfig.json</DependentUpon>
    </None>
    <None Include="tsconfig.Release.json">
      <DependentUpon>tsconfig.json</DependentUpon>
    </None>
  </ItemGroup>
  <ItemGroup>
    <TypeScriptCompile Include="HelloWorldApplication.ts" />
  </ItemGroup>
  <ItemGroup />
  <ItemGroup>
    <ProjectReference Include="..\..\..\Ajs\Ajs.csproj">
      <Project>{267086da-ab24-4d8d-bd5f-d7d3b3d7db67}</Project>
      <Name>Ajs</Name>
    </ProjectReference>
  </ItemGroup>
  <PropertyGroup Condition="'$(Configuration)' == 'Debug'">
    <TypeScriptRemoveComments>false</TypeScriptRemoveComments>
    <TypeScriptSourceMap>true</TypeScriptSourceMap>
    <TypeScriptTarget>ES5</TypeScriptTarget>
    <TypeScriptJSXEmit>React</TypeScriptJSXEmit>
    <TypeScriptCompileOnSaveEnabled>True</TypeScriptCompileOnSaveEnabled>
    <TypeScriptNoImplicitAny>False</TypeScriptNoImplicitAny>
    <TypeScriptModuleKind>None</TypeScriptModuleKind>
    <TypeScriptOutFile>
    </TypeScriptOutFile>
    <TypeScriptOutDir />
    <TypeScriptGeneratesDeclarations>True</TypeScriptGeneratesDeclarations>
    <TypeScriptNoEmitOnError>True</TypeScriptNoEmitOnError>
    <TypeScriptMapRoot>
    </TypeScriptMapRoot>
    <TypeScriptSourceRoot>
    </TypeScriptSourceRoot>
  </PropertyGroup>
  <PropertyGroup Condition="'$(Configuration)' == 'Release'">
    <TypeScriptRemoveComments>true</TypeScriptRemoveComments>
    <TypeScriptSourceMap>false</TypeScriptSourceMap>
    <TypeScriptTarget>ES5</TypeScriptTarget>
    <TypeScriptJSXEmit>None</TypeScriptJSXEmit>
    <TypeScriptCompileOnSaveEnabled>True</TypeScriptCompileOnSaveEnabled>
    <TypeScriptNoImplicitAny>False</TypeScriptNoImplicitAny>
    <TypeScriptModuleKind>None</TypeScriptModuleKind>
    <TypeScriptOutFile>.</TypeScriptOutFile>
    <TypeScriptOutDir />
    <TypeScriptGeneratesDeclarations>True</TypeScriptGeneratesDeclarations>
    <TypeScriptNoEmitOnError>True</TypeScriptNoEmitOnError>
    <TypeScriptMapRoot />
    <TypeScriptSourceRoot />
  </PropertyGroup>
  <Import Project="$(MSBuildBinPath)\Microsoft.CSharp.targets" />
  <Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\WebApplications\Microsoft.WebApplication.targets" Condition="Exists('$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\WebApplications\Microsoft.WebApplication.targets')" />
  <Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.targets" Condition="Exists('$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\TypeScript\Microsoft.TypeScript.targets')" />
  <ProjectExtensions>
    <VisualStudio>
      <FlavorProperties GUID="{349c5851-65df-11da-9384-00065b846f21}">
        <WebProjectProperties>
          <UseIIS>True</UseIIS>
          <AutoAssignPort>True</AutoAssignPort>
          <DevelopmentServerPort>0</DevelopmentServerPort>
          <DevelopmentServerVPath>/</DevelopmentServerVPath>
          <IISUrl>http://localhost:21281/</IISUrl>
          <NTLMAuthentication>False</NTLMAuthentication>
          <UseCustomServer>False</UseCustomServer>
          <CustomServerUrl>
          </CustomServerUrl>
          <SaveServerSettingsInUserFile>False</SaveServerSettingsInUserFile>
        </WebProjectProperties>
      </FlavorProperties>
    </VisualStudio>
  </ProjectExtensions>
</Project>

[fis-cz]

I've gave it another try and reworked the tsconfig to .csproj.
Now it tells me that modules (I want to load from another project compilation target folder) does not exists. Unfortunately, --paths switch is not supported so I can't do any tests with that. It seems the --baseUrl is ignored from the csproj. Compilation of the project works well again, only intellisense can't locate libraries.

  <PropertyGroup Condition="'$(Configuration)' == 'Debug'">
    <TypeScriptRemoveComments>false</TypeScriptRemoveComments>
    <TypeScriptTarget>ES5</TypeScriptTarget>
    <TypeScriptJSXEmit>React</TypeScriptJSXEmit>
    <TypeScriptCompileOnSaveEnabled>True</TypeScriptCompileOnSaveEnabled>
    <TypeScriptModuleKind>AMD</TypeScriptModuleKind>
    <TypeScriptModuleResolution>Node</TypeScriptModuleResolution>
    <TypeScriptBaseUrl>..\..\..\Ajs\bin\</TypeScriptBaseUrl>
    <TypeScriptLib>dom,es2015.promise,es5</TypeScriptLib>
    <TypeScriptOutFile>./bin/HelloWorld.js</TypeScriptOutFile>
    <TypeScriptGeneratesDeclarations>True</TypeScriptGeneratesDeclarations>
    <TypeScriptSourceMap>True</TypeScriptSourceMap>
    <TypeScriptMapRoot>/js</TypeScriptMapRoot>
    <TypeScriptSourceRoot>/src/HelloWorld</TypeScriptSourceRoot>
    <TypeScriptRemoveComments>False</TypeScriptRemoveComments>
    <TypeScriptExperimentalDecorators>True</TypeScriptExperimentalDecorators>
    <TypeScriptNoImplicitAny>True</TypeScriptNoImplicitAny>
    <TypeScriptNoEmitHelpers>True</TypeScriptNoEmitHelpers>
    <TypeScriptNoEmitOnError>True</TypeScriptNoEmitOnError>
  </PropertyGroup>

[fis-cz]

Resolved temporarily with npm local linked package:

   ...
  "devDependencies": {
    "ajsfw": "file:../../../Ajs/bin/ajsfw"
  }
  ...

But it would be great to be working natively.

[fis-cz]

as the previous solution does not update recompiled files I ended with a npm script which is creating the directory junction:

package.json

  "scripts": {
    "install": " if not exist \"%cd%\\node_modules\\ajsfw\" (mklink /j \"%cd%\\node_modules\\ajsfw\" \"..\\..\\..\\Ajs\\bin\\ajsfw\") "
  }

as I have found on the NPM the file: behavior will be changed so it will be possible to link local modules without need of npm link command.

[fis-cz]

I also needed to fake npm local package to be able to use the library under development without need of publishing it. so my package json now looks like this:

  "dependencies": {
    "ajsfw": "file:../../../Ajs/npmdev"
  },
  "scripts": {
    "install": " if not exist \"%cd%\\node_modules\\ajsfw\" (mklink /j \"%cd%\\node_modules\\ajsfw\" \"..\\..\\..\\Ajs\\bin\\ajsfw\") "
  }

where npmdev is just a fake and completely empty package which is not installing anything to node_modules of the "application" project. It iss placed in the library project and it's package.json is as follows:

{
  "name": "fake-package",
  "version": "0.0.1",
  "description": "required to fake dev package insallation",
  "license": "MIT",
  "author": {
    "name": "Atom Software Studios",
    "email": "[email protected]"
  }
}

Also, I omitted all external tsconfig.json files and transferred all TSC configurations to csproj (msbuild) xml. Now it finally seems to be working (except I have no intellisense for imports what I can live with for now, the rest fortunately works well). As I could see in NPM repo (and issue tracker) they prepare similar support with using the "link:" instead of "file:" in the dependency definition so it should be easier in near future.

I was also surprised the TS can't resolve submodules when the library (which is consisting of many local submodules) is compiled to single file with acompanying d.ts. In the final, I will need to pack it using some 3rd party tool which will take care of map files correctly

Nothing works. Once the compilation works, then only intellisense works. Then nothing.

Only publishing npm package then installing it seems to be a correct way. Thats really painful. And very non-comforable.

---

Offtopic:
Its really really hard to make development with Visual Studio and TypeScript comfortable. As I originally started with Delphi 2.0 IDE then I was using VS IDE with C# I am habituated to something else. This is really geeky and requires to know tons and tons of additional software starting with node over the npm, gulp and tons of additional packages, like webpack, browserify to minifiers, The worst thing is that some packages don't work well (such as chokidar which is still throwing EPERM errors on Windows platform so continuous update of the dist folder is a nightmare). Additionally, stuff like node internals, tons of libraries, HTML, DOM, browser internals, javasript itself, frontend frameworks, everything has to be known to developer. And where is focus on the business? I am sorry I am crying like a small child here but I am getting to be old for things like this.

[aluanhaddad]

It is indeed painful but VS 2017, by incorporating the TypeScript language service improves on VS 2015 immensely in this regard.

[fis-cz]

@aluanhaddad Hopefully. Currently it does not work so good. The language service seems to be buggy too much. Additioanlly, I am afraid it will fix all that problems with namespacing and local module development, compilation options setup on project property page... I am looking forward for NPM 5. But I also hope the TS support for it will be implemented soon. On other hand. I would welcome support of all that nice features of visual studio. I would name the project dependencies as the main. Without need of configuration of the package.json and whatever else. I know its almost impossible to be implemented because of the way how packaging works. But would be nice.

By the way, what is the reason the VS extension is not opensource? I would be glad to contribute to it.

[aluanhaddad]

I've had good experiences with VS 2017 and TypeScript so far but I've been working in the folder view, not the solution view.

Sadly, I know nothing about the VS plugin or how you might contribute to it, a TypeScript team member would likely be able to tell you.

And yeah, NPM is a mess :/

[fis-cz]

Its nice to see that somebody sympathizes with me :) Thanks. I am already a subject to depression from all that stuff. On other hand, I like the idea behind all that tools. Its unfortunate it does not work as one would expect. At least guys are trying to do their best :) Although I sometimes don't agree the way they do it ;)

[RyanCavanaugh]

Please log a new issue with specific repro steps if you're still seeing this. Hopefully a lot has changed in the intervening 2.5 years 😬