web-dev-qa-db-fra.com

Utilisez fs en dactylographié

J'essaie juste de lire un fichier en utilisant fs.readFileSync, bien qu'il semble que cela ne puisse pas être trouvé.

Je me suis assuré de le déclarer, l'a ajouté dans mon constructeur:

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`
        });
    }
[...]

Et utilisé dans une fonction simple:

verifyToken = (token) => {

    console.log(this.fs);
    let contents = this.fs.readFileSync('../utils/public.key', 'utf8');
    console.log(contents);

}

Mais cela soulève un Uncaught TypeError: _this.fs.readFileSync is not a function. Existe-t-il un moyen spécial d'inclure fs dans TypeScript?

17

Première. Je ne peux imaginer aucun cas dans lequel vous utiliseriez fs à l'intérieur d'un composant React. Même si vous pouvez utiliser React sur le serveur pour rendre des choses, le même code est censé fonctionner dans le client, vous ne pouvez pas accéder à fs dans le client.

Si vous voulez utiliser fs dans le serveur, voici un exemple:

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

Sur votre fichier package.json, Assurez-vous d’avoir une dépendance sur le noeud

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

Et voici à quoi ressemble mon fichier tsconfig.json:

{
    "compilerOptions": {
        "outDir": "./dist/",
        "sourceMap": true,
        "noImplicitAny": true,
        "module": "commonjs",
        "target": "es5",
        "jsx": "react",
        "allowJs": true,
        "typeRoots": [
            "./node_modules/@types"
        ]
    },
    "include": [
        "./db/**/*",
        "./src/**/*"
    ]
}
41
André Pena

Utiliser node -v 10.15.0 Et @ types/node :

Il semble que la déclaration ait été réécrite ...

fs définition est déclarée comme module alors vous devriez faire:

import fs from "fs"; // Without star

compilé:

var fs_1 = __importDefault(require("fs"));

ou

const fs = require("fs"); au lieu de require("fs").default;

avec étoile vous aurez fs.default.TheFunctionYouWant au lieu de fs.TheFunctionYouWant

Le meilleur moyen consiste à console.log(fs); pour voir ce qu'il est importé.

{
  "compilerOptions": {
    "typeRoots": [],
    "types": [
      "node"
    ]
  }
}
1
Shim-Sao