Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Use fs in typescript

I'm just trying to read a file using fs.readFileSync, though it seems it cannot be found.

I made sure to declare it, added it within my constructor:

export default class Login extends React.Component<LoginProps, {}> {     private webAuth: auth0.WebAuth;     fs: any;      constructor(props: any, context: any) {         super(props, context);         this.fs = require('fs');         this.webAuth = new auth0.WebAuth({             clientID: conf.auth0.clientId,             domain: conf.auth0.domain,             responseType: 'token id_token',             redirectUri: `${window.location.origin}/login`         });     } [...] 

And used it in a simple function:

verifyToken = (token) => {      console.log(this.fs);     let contents = this.fs.readFileSync('../utils/public.key', 'utf8');     console.log(contents);  } 

But this raises an Uncaught TypeError: _this.fs.readFileSync is not a function. Is there a special way to include fs in Typescript ?

like image 530
Pierre Olivier Tran Avatar asked Mar 27 '17 13:03

Pierre Olivier Tran


People also ask

How do I use TypeScript fs?

To import and use the fs module in TypeScript, make sure to install the type definitions for node by running npm i -D @types/node and import fs with the following line import * as fs from 'fs' , or import { promises as fsPromises } from 'fs' if using fs promises.

Can I use fs in angular?

The 'fs' module is a node module which is not available in Angular (or any other framework for that matter). What happens is that the Angular code is transpiled and minified and runs in the browser context, not in the node context. Browsers are sandboxed and cannot access the client file system.

What is fs in Require (' fs ')?

The Node.js file system module allows you to work with the file system on your computer. To include the File System module, use the require() method: var fs = require('fs'); Common use for the File System module: Read files.

Can not find module fs TypeScript?

To solve the "Cannot find module fs or its corresponding type declarations" error, install the types for node by running the command npm i -D @types/node . You can then import fs with the following line of code import * as fs from 'fs' . Copied!


1 Answers

I can't imagine any case in which you would use fs inside a React component. Even though you can use React in the server to render stuff, the same code is supposed to run in the client, there's no way you can access fs in the client.

If you want to use fs in the server, this is an example:

import * as fs from 'fs'; import * as path from 'path'; fs.readFile(path.join(__dirname, '../../client/index.html'), 'utf8', (error, data) => {         // ...     }) 

On your package.json file, make sure to have a dependency on node

"dependencies": {  "@types/node": "^7.0.5" } 

And this is how my tsconfig.json file looks like:

{     "compilerOptions": {         "outDir": "./dist/",         "sourceMap": true,         "noImplicitAny": true,         "module": "commonjs",         "target": "es5",         "jsx": "react",         "allowJs": true,         "typeRoots": [             "./node_modules/@types"         ]     },     "include": [         "./db/**/*",         "./src/**/*"     ] } 
like image 157
André Pena Avatar answered Sep 29 '22 17:09

André Pena