{"id":2241,"date":"2018-03-01T19:59:42","date_gmt":"2018-03-02T01:59:42","guid":{"rendered":"https:\/\/www.wiredprairie.us\/blog\/?p=2241"},"modified":"2018-03-01T19:59:42","modified_gmt":"2018-03-02T01:59:42","slug":"ts2688-with-typescript-react-native-and-mobx","status":"publish","type":"post","link":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/2241","title":{"rendered":"TS2688 with TypeScript, React Native, and MobX"},"content":{"rendered":"

To\u00a0preserve my sanity if I should run into this again….\u00a0<\/em><\/p>\n

I created a React Native project, ejected it, and then converted it to use TypeScript. Things were going well until I started to use MobX. The following error occurred:<\/p>\n

node_modules\/mobx\/lib\/utils\/utils.d.ts(1,23): error TS2688: Cannot find type definition file for 'node'.<\/pre>\n
Something as simple as:<\/p>\n
\n
import { observable } from \"mobx\";<\/pre>\n
may cause the error shown above. If you look at the utils.d.ts<\/strong> file mentioned in the TS2688 error line, you’ll see what’s causing the error:<\/div>\n<\/div>\n
\n
\n
\/\/\/ <reference types=\"node\" \/><\/pre>\n<\/div>\n<\/div>\n
It seems like a harmless error and easily resolved. Usually when there are missing types, your first step should be to add them to your project. My first attempt was to add the @types\/node<\/strong> to the project.<\/div>\n
yarn add -D @types\/node<\/pre>\n
Bzzt<\/strong>. That produces a whole new batch of errors due to duplicate definitions. There are quite a few classes and functions that are duplicates when React Native and Node declarations are both imported.<\/div>\n
<\/div>\n
Apparently, this needs a stub for node so that the error can be bypassed (without changing or using other compiler switches like –skipLibCheck<\/strong>).<\/div>\n
<\/div>\n
I created a new folder in the src<\/strong> tree called typings<\/strong>. In that folder, I created another folder, this time called node<\/strong>. And finally, in that folder, I created a nearly empty file called index.d.ts <\/strong>(the file contains a comment about why I created the file and a link to this blog post).<\/div>\n
<\/div>\n
\"Folder<\/a><\/div>\n
<\/div>\n
The project now compiles without issue. The declaration types that were needed by MobX are already included elsewhere, but the pesky reference directive forces the compiler to try to locate the types.<\/div>\n
<\/div>\n
<\/div>\n
\n
<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"
To\u00a0preserve my sanity if I should run into this again….\u00a0 I created a React Native project, ejected it, and then converted it to use TypeScript. Things were going well until I started to use MobX. The following error occurred: node_modules\/mobx\/lib\/utils\/utils.d.ts(1,23): error TS2688: Cannot find type definition file for ‘node’. Something as simple as: import { […]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"spay_email":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true},"categories":[4],"tags":[],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/pd5QIe-A9","jetpack_likes_enabled":true,"jetpack-related-posts":[{"id":2052,"url":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/2052","url_meta":{"origin":2241,"position":0},"title":"MobX and TypeScript Experiement","date":"October 25, 2016","format":false,"excerpt":"I wanted to give MobX a try, in particular from TypeScript. Here\u2019s my first attempt. I liberally used the documentation example found within\u00a0createTransformer\u00a0as my guide. [javascript] import \"core-js\"; import { observable, autorun, createTransformer } from \"mobx\"; \/* The store that holds our domain: boxes and arrows *\/ class Store implements\u2026","rel":"","context":"In "Coding"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":111,"url":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/111","url_meta":{"origin":2241,"position":1},"title":"Disabling Apple Software Update on Vista","date":"April 10, 2008","format":false,"excerpt":"I've complained (and so have many others) about the Apple Software Update functionality -- especially now that it suggests that I update software I never had installed (Safari)! On Vista (and XP is probably similar), there's a scheduled task that runs once a week to look for updates. To stop\u2026","rel":"","context":"In "Software"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":1693,"url":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/1693","url_meta":{"origin":2241,"position":2},"title":"Simple Node based Http Put simulator","date":"July 31, 2012","format":false,"excerpt":"It\u2019s great what you can accomplish in a few lines of code. The Node based source code below uses express to create a mini view-based web server along with a mock Http Put file upload destination. \/** * Module dependencies. *\/var express = require('express') , routes = require('.\/routes') , http\u2026","rel":"","context":"In "Coding"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":2020,"url":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/2020","url_meta":{"origin":2241,"position":3},"title":"My Raspberry Pi 2 Model B setup","date":"March 9, 2015","format":false,"excerpt":"I recently purchased a Raspberry Pi 2 in preparation for installation of Windows 10 (and more) (when there\u2019s a version that\u2019s compatible). In the mean time, I installed the current version of Raspbian. I bought a simple case via Amazon. Nothing too fancy \u2026 extremely functional (it allows the LEDs\u2026","rel":"","context":"In "Recommendations"","img":{"alt_text":"image of Raspberry Pi desktop","src":"https:\/\/i0.wp.com\/www.wiredprairie.us\/blog\/wp-content\/uploads\/2015\/03\/image1.png?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":1449,"url":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/1449","url_meta":{"origin":2241,"position":4},"title":".NET API for Nest Thermostat","date":"January 9, 2012","format":false,"excerpt":"I just finished a preliminary read-only (think version 0.1) wrapper around the Nest Thermostat API that is used by their mobile phone and web applications. As Nest doesn\u2019t have a formal API yet, the code could break at any time and may not be suitable for any use. However, it\u2026","rel":"","context":"In "Coding"","img":{"alt_text":"SNAGHTML88bff0b3","src":"https:\/\/i0.wp.com\/www.wiredprairie.us\/blog\/wp-content\/uploads\/2012\/01\/SNAGHTML88bff0b3_thumb.png?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":1754,"url":"https:\/\/www.wiredprairie.us\/blog\/index.php\/archives\/1754","url_meta":{"origin":2241,"position":5},"title":"Nest Thermostat API using Node JS and Nest API Update","date":"October 9, 2012","format":false,"excerpt":"I\u2019ve been asked by a few people for more details on the API Nest Labs uses for their thermostats, especially regarding setting data (and not just polling). The API uses mostly JSON formatted data POSTed to their web servers. Authentication To authenticate, POST the username and password, encoded as form\u2026","rel":"","context":"In "Coding"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"_links":{"self":[{"href":"https:\/\/www.wiredprairie.us\/blog\/index.php\/wpjson\/wp\/v2\/posts\/2241"}],"collection":[{"href":"https:\/\/www.wiredprairie.us\/blog\/index.php\/wpjson\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wiredprairie.us\/blog\/index.php\/wpjson\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wiredprairie.us\/blog\/index.php\/wpjson\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wiredprairie.us\/blog\/index.php\/wpjson\/wp\/v2\/comments?post=2241"}],"version-history":[{"count":3,"href":"https:\/\/www.wiredprairie.us\/blog\/index.php\/wpjson\/wp\/v2\/posts\/2241\/revisions"}],"predecessor-version":[{"id":2245,"href":"https:\/\/www.wiredprairie.us\/blog\/index.php\/wpjson\/wp\/v2\/posts\/2241\/revisions\/2245"}],"wp:attachment":[{"href":"https:\/\/www.wiredprairie.us\/blog\/index.php\/wpjson\/wp\/v2\/media?parent=2241"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wiredprairie.us\/blog\/index.php\/wpjson\/wp\/v2\/categories?post=2241"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wiredprairie.us\/blog\/index.php\/wpjson\/wp\/v2\/tags?post=2241"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}