SOLVED

I have upgraded from yeoman 1.3.4 to 1.4.0 and I cannot import mystrings.d.ts

%3CLINGO-SUB%20id%3D%22lingo-sub-144446%22%20slang%3D%22en-US%22%3EI%20have%20upgraded%20from%20yeoman%201.3.4%20to%201.4.0%20and%20I%20cannot%20import%20mystrings.d.ts%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-144446%22%20slang%3D%22en-US%22%3E%3CP%3EI%20have%20a%20file%20mystrings.d.ts%20which%20contains%20%3A-%3C%2FP%3E%0A%3CPRE%20class%3D%22default%20prettyprint%20prettyprinted%22%3E%3CCODE%3E%3CSPAN%20class%3D%22pln%22%3E%20%20declare%20%3C%2FSPAN%3E%3CSPAN%20class%3D%22kwd%22%3Einterface%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22typ%22%3EIReactSearchBoxStrings%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22pun%22%3E%7B%3C%2FSPAN%3E%0A%20%20%3CSPAN%20class%3D%22typ%22%3EPropertyPaneSearchOptions%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3A%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22kwd%22%3Estring%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3B%3C%2FSPAN%3E%0A%20%20%3CSPAN%20class%3D%22typ%22%3EBasicGroupName%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3A%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22kwd%22%3Estring%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3B%3C%2FSPAN%3E%0A%20%20%3CSPAN%20class%3D%22typ%22%3EDefaultSearchResultsPageUrlFieldLabel%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3A%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22kwd%22%3Estring%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3B%3C%2FSPAN%3E%0A%20%20%3CSPAN%20class%3D%22typ%22%3EEnableCustomSearchPlaceholderLabel%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3A%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22kwd%22%3Estring%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3B%3C%2FSPAN%3E%0A%20%20%3CSPAN%20class%3D%22typ%22%3ESearchLabel%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3A%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22kwd%22%3Estring%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3B%3C%2FSPAN%3E%0A%20%20%3CSPAN%20class%3D%22typ%22%3ECustomSearchPlaceholderModeOnAlert%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3A%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22kwd%22%3Estring%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3B%3C%2FSPAN%3E%0A%3CSPAN%20class%3D%22pun%22%3E%7D%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3E%0A%0A%0Adeclare%20%3C%2FSPAN%3E%3CSPAN%20class%3D%22kwd%22%3Emodule%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22str%22%3E'reactSearchBoxStrings'%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22pun%22%3E%7B%3C%2FSPAN%3E%0A%20%20%3CSPAN%20class%3D%22kwd%22%3Econst%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3E%20strings%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3A%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22typ%22%3EIReactSearchBoxStrings%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3B%3C%2FSPAN%3E%0A%20%20%3CSPAN%20class%3D%22kwd%22%3Eexport%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22pun%22%3E%3D%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3E%20strings%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3B%3C%2FSPAN%3E%0A%3CSPAN%20class%3D%22pun%22%3E%7D%3C%2FSPAN%3E%3C%2FCODE%3E%3C%2FPRE%3E%0A%3CP%3EI%20want%20to%20import%20the%20contents%20thus%20into%20ReactSearchBoxWebPart.ts%3A-%3C%2FP%3E%0A%3CPRE%20class%3D%22default%20prettyprint%20prettyprinted%22%3E%3CCODE%3E%3CSPAN%20class%3D%22kwd%22%3Eimport%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22pun%22%3E*%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22kwd%22%3Eas%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3E%20strings%20%3C%2FSPAN%3E%3CSPAN%20class%3D%22kwd%22%3Efrom%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22str%22%3E'reactSearchBoxStrings'%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3B%3C%2FSPAN%3E%3C%2FCODE%3E%3C%2FPRE%3E%0A%3CP%3EIt%20complies%20but%20when%20I%20want%20to%20ship%20it%20(gulp%20bundle%20--ship)%20I%20get%20this%20error%20%3A-%3C%2FP%3E%0A%3CPRE%20class%3D%22default%20prettyprint%20prettyprinted%22%3E%3CCODE%3E%3CSPAN%20class%3D%22typ%22%3EModule%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22kwd%22%3Enot%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3E%20found%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3A%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22typ%22%3EError%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3A%3C%2FSPAN%3E%20%3CSPAN%20class%3D%22typ%22%3ECan%3C%2FSPAN%3E%3CSPAN%20class%3D%22str%22%3E't%20resolve%20'%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3EreactSearchBoxStrings%3C%2FSPAN%3E%3CSPAN%20class%3D%22str%22%3E'%20in%20'%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3EC%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3A%3C%2FSPAN%3E%3CSPAN%20class%3D%22str%22%3E%2FUsers%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Exxxx%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22typ%22%3EDocuments%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22typ%22%3ESPFx%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22typ%22%3EProjects%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22lit%22%3E1%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E-%3C%2FSPAN%3E%3CSPAN%20class%3D%22lit%22%3E4%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E-%3C%2FSPAN%3E%3CSPAN%20class%3D%22lit%22%3E0%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Ereact%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E-%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Esearch%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E-%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Ebox%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E-%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Ewebpart%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Elib%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Ewebparts%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3EreactSearchBox%3C%2FSPAN%3E%3CSPAN%20class%3D%22str%22%3E'%0Aresolve%20'%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3EreactSearchBoxStrings%3C%2FSPAN%3E%3CSPAN%20class%3D%22str%22%3E'%20in%20'%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3EC%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%3A%3C%2FSPAN%3E%3CSPAN%20class%3D%22str%22%3E%2FUsers%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Exxxx%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22typ%22%3EDocuments%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22typ%22%3ESPFx%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22typ%22%3EProjects%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22lit%22%3E1%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E-%3C%2FSPAN%3E%3CSPAN%20class%3D%22lit%22%3E4%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E-%3C%2FSPAN%3E%3CSPAN%20class%3D%22lit%22%3E0%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Ereact%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E-%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Esearch%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E-%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Ebox%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E-%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Ewebpart%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Elib%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3Ewebparts%3C%2FSPAN%3E%3CSPAN%20class%3D%22pun%22%3E%2F%3C%2FSPAN%3E%3CSPAN%20class%3D%22pln%22%3EreactSearchBox%3C%2FSPAN%3E%3CSPAN%20class%3D%22str%22%3E'%3C%2FSPAN%3E%3C%2FCODE%3E%3C%2FPRE%3E%0A%3CP%3EThis%20worked%20Ok%20when%20the%20project%20was%20built%20with%20yeoman%201.3.4%2C%20but%20does%20not%20work%20when%20the%20project%20is%20built%20with%20yeoman%201.4.0.%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-LABS%20id%3D%22lingo-labs-144446%22%20slang%3D%22en-US%22%3E%3CLINGO-LABEL%3EDeveloper%3C%2FLINGO-LABEL%3E%3CLINGO-LABEL%3ESPFx%3C%2FLINGO-LABEL%3E%3CLINGO-LABEL%3Etypescript%3C%2FLINGO-LABEL%3E%3C%2FLINGO-LABS%3E%3CLINGO-SUB%20id%3D%22lingo-sub-145148%22%20slang%3D%22en-US%22%3ERe%3A%20I%20have%20upgraded%20from%20yeoman%201.3.4%20to%201.4.0%20and%20I%20cannot%20import%20mystrings.d.ts%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-145148%22%20slang%3D%22en-US%22%3E%3CP%3EThis%20is%20due%20to%20yeoman%201.4.0%20using%20TypeScript%202.4.2%20which%20starts%20to%20phase%20out%20.d.ts%20and%26nbsp%3B%40Typings.%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3ESo%20to%20fix%26nbsp%3Brename%20%22MyStrings.d.ts%22%20to%20IReactSearchBoxStrings%2Cts.%26nbsp%3B%20Change%20the%20contents%20to%26nbsp%3B%3C%2FP%3E%0A%3CPRE%3E%20export%20interface%20IReactSearchBoxStrings%20%7B%0A%20%20PropertyPaneSearchOptions%3A%20string%3B%0A%20%20BasicGroupName%3A%20string%3B%0A%20%20DefaultSearchResultsPageUrlFieldLabel%3A%20string%3B%0A%20%20EnableCustomSearchPlaceholderLabel%3A%20string%3B%0A%20%20SearchLabel%3A%20string%3B%0A%20%20CustomSearchPlaceholderModeOnAlert%3A%20string%3B%0A%7D%0A%3C%2FPRE%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3Echange%3C%2FP%3E%0A%3CPRE%3Eimport%20*%20as%20strings%20from%20reactSearchBoxStrings%3C%2FPRE%3E%0A%3CP%3Eto%26nbsp%3B%3C%2FP%3E%0A%3CPRE%3Eimport%20%7B%20IReactSearchBoxStrings%7D%20from%20'.%2Fcomponents%2FIReactSearchBoxStrings'%3B%3C%2FPRE%3E%0A%3CP%3Eand%20finally%20add%26nbsp%3B%3C%2FP%3E%0A%3CPRE%3Evar%20strings%3A%20IReactSearchBoxStrings%3B%3C%2FPRE%3E%0A%3CP%3EThen%20it%20all%20compiles%20and%20links.%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3ERegards%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%0A%3CP%3ENigel%3C%2FP%3E%0A%3CP%3E%26nbsp%3B%3C%2FP%3E%3C%2FLINGO-BODY%3E
Highlighted
Regular Contributor

I have a file mystrings.d.ts which contains :-

  declare interface IReactSearchBoxStrings {
  PropertyPaneSearchOptions: string;
  BasicGroupName: string;
  DefaultSearchResultsPageUrlFieldLabel: string;
  EnableCustomSearchPlaceholderLabel: string;
  SearchLabel: string;
  CustomSearchPlaceholderModeOnAlert: string;
}


declare module 'reactSearchBoxStrings' {
  const strings: IReactSearchBoxStrings;
  export = strings;
}

I want to import the contents thus into ReactSearchBoxWebPart.ts:-

import * as strings from 'reactSearchBoxStrings';

It complies but when I want to ship it (gulp bundle --ship) I get this error :-

Module not found: Error: Can't resolve 'reactSearchBoxStrings' in 'C:/Users/xxxx/Documents/SPFx/Projects/1-4-0/react-search-box-webpart/lib/webparts/reactSearchBox'
resolve 'reactSearchBoxStrings' in 'C:/Users/xxxx/Documents/SPFx/Projects/1-4-0/react-search-box-webpart/lib/webparts/reactSearchBox'

This worked Ok when the project was built with yeoman 1.3.4, but does not work when the project is built with yeoman 1.4.0.

1 Reply
Highlighted
Best Response confirmed by Nigel Price (Regular Contributor)
Solution

This is due to yeoman 1.4.0 using TypeScript 2.4.2 which starts to phase out .d.ts and @Typings.

 

So to fix rename "MyStrings.d.ts" to IReactSearchBoxStrings,ts.  Change the contents to 

 export interface IReactSearchBoxStrings {
  PropertyPaneSearchOptions: string;
  BasicGroupName: string;
  DefaultSearchResultsPageUrlFieldLabel: string;
  EnableCustomSearchPlaceholderLabel: string;
  SearchLabel: string;
  CustomSearchPlaceholderModeOnAlert: string;
}

 

change

import * as strings from reactSearchBoxStrings

to 

import { IReactSearchBoxStrings} from './components/IReactSearchBoxStrings';

and finally add 

var strings: IReactSearchBoxStrings;

Then it all compiles and links.

 

Regards

 

Nigel