Forum Discussion

Nigel_Price9911's avatar
Nigel_Price9911
Iron Contributor
Jan 12, 2018
Solved

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

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.

developer
SPFx
TypeScript
  • Nigel_Price9911's avatar
    Nigel_Price9911
    Jan 15, 2018

    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

     

1 Reply

Sort By
  • Nigel_Price9911's avatar
    Nigel_Price9911
    Iron Contributor
    Jan 15, 2018

    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

     

Resources