Angular 7 how to use fs module?

Question

I'm using Angular 7.

I tried to use fs module on Typescript for open a directory. I always have this error: "Module not found: Error: Can't resolve fs" types@node and file-system are installed.

My code:

import {Component, OnInit} from '@angular/core';
import * as fs from 'file-system';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit  {
  title = 'my-app';

  constructor() {

  }

  ngOnInit() {
    console.log(fs);
  }
}

Can you help me ?

Node : v10.14.0 Npm: v6.4.1 Angular CLI: v7.1.1

Angular applications run in the browser. Not in NodeJS on the server. There is no access to the file system in the browser, and you can't use NodeJS-specific modules there. — JB Nizet
– JB Nizet, Commented Dec 6, 2018 at 17:25
I update my question. I thought that angular could call nodejs function :/ — Eng
– Eng, Commented Dec 6, 2018 at 18:32
You can, in the compile step you are free to access the filesystem and involve files from other places. When the application is compiled and/or build, you no longer can. There is no access to the filesystem from the client as JB said. — Bjorn 'Bjeaurn' S
– Bjorn 'Bjeaurn' S, Commented Jun 5, 2019 at 8:53
Does this answer your question? Node JS fs module inside browser — Heretic Monkey
– Heretic Monkey, Commented Aug 10, 2020 at 13:37

Alex Rempel · Accepted Answer · 2020-08-10 13:13:54Z

8

'fs' is a library for NodeJS runtime, but the end product of the Angular pipeline bundler is a frontend SPA client which runs in a browser. If you need to load a file into the client from the user's local filesystem then you need to use browser native variant e.g. take a look at handling <input type="file"> elements.

answered Aug 10, 2020 at 13:13

Alex Rempel

6307 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sathiamoorthy · Accepted Answer · 2021-02-09 09:08:14Z

4

fs module is not available in Angular. Use the below package to use fs module.

npm install file-system --save

Example:

var fs = require('file-system');
 
fs.mkdir('1/2/3/4/5', [mode], function(err) {});
fs.mkdirSync('1/2/3/4/5', [mode]);
fs.writeFile('path/test.txt', 'aaa', function(err) {})

Reference: https://www.npmjs.com/package/file-system

answered Feb 9, 2021 at 9:08

Sathiamoorthy

12.1k12 gold badges78 silver badges92 bronze badges

1 Comment

Ap0st0l Over a year ago

Last updated 7 years ago...

Vlad Gheorghita · Accepted Answer · 2020-03-03 06:31:53Z

2

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. If this were possible than the web would be a lot more dangerous :).

answered Mar 3, 2020 at 6:31

Vlad Gheorghita

1204 bronze badges

1 Comment

Jamie Nicholl-Shelley Over a year ago

I'm afraid this isn't true. You can use webpack to allow file-stream to access files uploaded by a user, as long as permissions are granted. You can build this manually. Or use any of a number of module wrappers.

Collectives™ on Stack Overflow

Angular 7 how to use fs module?

3 Answers 3

Comments

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related