1"use strict";(self.webpackChunkwebsite=self.webpackChunkwebsite||[]).push([["1936"],{28388(e,t,n){n.r(t),n.d(t,{assets:()=>a,contentTitle:()=>p,default:()=>d,frontMatter:()=>i,metadata:()=>s,toc:()=>l});var s=n(34899),r=n(65723),o=n(7143);let i={authors:"joshuakgoldberg",description:"Why enforcing TypeScript imports use the `type` modifier when possible benefits some project setups.",slug:"consistent-type-imports-and-exports-why-and-how",tags:["typescript","imports","exports","types","transpiling"],title:"Consistent Type Imports and Exports: Why and How"},p,a={authorsImageUrls:[void 0]},l=[];function c(e){let t={a:"a",code:"code",em:"em",li:"li",p:"p",ul:"ul",...(0,o.R)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsxs)(t.p,{children:[(0,r.jsx)(t.code,{children:"import"})," and ",(0,r.jsx)(t.code,{children:"export"})," statements are core features of the JavaScript language.\nThey were added as part of the ",(0,r.jsx)(t.a,{href:"https://nodejs.org/api/esm.html#modules-ecmascript-modules",children:"ECMAScript Modules (ESM)"})," specification, and now are generally available in most mainstream JavaScript environments, including all evergreen browsers and Node.js."]}),"\n",(0,r.jsxs)(t.p,{children:["When writing TypeScript code with ESM, it can sometimes be desirable to import or export a type only in the type system.\nCode may wish to refer to a ",(0,r.jsx)(t.em,{children:"type"}),", but not actually import or export a corresponding ",(0,r.jsx)(t.em,{children:"value"}),"."]}),"\n",(0,r.jsx)(t.p,{children:"Type-only imports and exports are not emitted as runtime code when code is transpiled to JavaScript.\nThis brings up two questions:"}),"\n",(0,r.jsxs)(t.ul,{children:["\n",(0,r.jsx)(t.li,{children:"Why would you want to use these type-only imports and exports?"}),"\n",(0,r.jsx)(t.li,{children:"How can you enforce a project use them whenever necessary?"}),"\n"]}),"\n",(0,r.jsx)(t.p,{children:"Let's dig in!"})]})}function d(e={}){let{wrapper:t}={...(0,o.R)(),...e.components};return t?(0,r.jsx)(t,{...e,children:(0,r.jsx)(c,{...e})}):c(e)}},7143(e,t,n){n.d(t,{R:()=>i,x:()=>p});var s=n(22155);let r={},o=s.createContext(r);function i(e){let t=s.useContext(o);return s.useMemo(function(){return"function"==typeof e?e(t):{...t,...e}},[t,e])}function p(e){let t;return t=e.disableParentContext?"function"==typeof e.components?e.components(r):e.components||r:i(e.components),s.createElement(o.Provider,{value:t},e.children)}},34899(e){e.exports=JSON.parse('{"permalink":"/blog/consistent-type-imports-and-exports-why-and-how","source":"@site/blog/2023-02-24-consistent-type-exports-and-imports-why-and-how.md","title":"Consistent Type Imports and Exports: Why and How","description":"Why enforcing TypeScript imports use the `type` modifier when possible benefits some project setups.","date":"2023-02-24T00:00:00.000Z","tags":[{"inline":true,"label":"typescript","permalink":"/blog/tags/typescript"},{"inline":true,"label":"imports","permalink":"/blog/tags/imports"},{"inline":true,"label":"exports","permalink":"/blog/tags/exports"},{"inline":true,"label":"types","permalink":"/blog/tags/types"},{"inline":true,"label":"transpiling","permalink":"/blog/tags/transpiling"}],"readingTime":6.12,"hasTruncateMarker":true,"authors":[{"name":"Josh Goldberg","title":"typescript-eslint Maintainer","url":"https://github.com/JoshuaKGoldberg","imageURL":"/img/team/joshuakgoldberg.jpg","key":"joshuakgoldberg","page":null}],"frontMatter":{"authors":"joshuakgoldberg","description":"Why enforcing TypeScript imports use the `type` modifier when possible benefits some project setups.","slug":"consistent-type-imports-and-exports-why-and-how","tags":["typescript","imports","exports","types","transpiling"],"title":"Consistent Type Imports and Exports: Why and How"},"unlisted":false,"prevItem":{"title":"Announcing typescript-eslint v6 Beta","permalink":"/blog/announcing-typescript-eslint-v6-beta"},"nextItem":{"title":"ASTs and typescript-eslint","permalink":"/blog/asts-and-typescript-eslint"}}')}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.