使用FS文件系統的節點，Webpack和React路由

我想使用NodeJS默認fs模塊讀取和寫入文件。我幾乎嘗試了所有可以在互聯網上找到的東西。 ES6和CommonJS的例子，編輯Webpack.config文件，添加應該添加Promise等的軟件包..但似乎沒有任何結果。使用FS文件系統的節點，Webpack和React路由

目前，這是我的webpack.config.js

var webpack = require('webpack'); 

module.exports = { 
    entry: './index.js', 

    output: { 
    path: 'public', 
    filename: 'bundle.js', 
    publicPath: '' 
    }, 

    node: { 
    fs: "empty" 
    }, 

    "browser": { "fs": false }, 

    resolve: { 
    modulesDirectories: ['web_modules', 'bower_components', 'node_modules'] 
    }, 

    module: { 
    loaders: [ 
     { 
     test: /\.js$/, 
     exclude: /node_modules/, 
     loader: 'babel-loader?presets[]=es2015&presets[]=react' 
     } 
    ] 
    } 
}

正如我所提到的一些線suggested in this topic其中添加。我想用下面顯示的組件fs.readFile：

var React = require('react'); 
var fs = require('fs'); 

var QuestionList = React.createClass({ 
    handleVote: function(id, state) { 
     var file = '../public/api/questions'; 
     fs.readSyncFile(file, function(err, data) { 
      console.log(err); 
      console.log(data); 
     }); 
    }, 

    render() { 
     var rows = [] 

     this.state.questions.forEach(function(question) { 
      rows.push(
       <QuestionItem 
        onVoteUpdate={this.handleVote} 
        key={question.id} 
        up={question.upvotes} down={question.downvotes} 
       /> 
      ); 
     }.bind(this)); 

     return (
      <section> 
       <ul className="question-list">{rows}</ul> 
      </section> 
     ) 
    } 
}); 

module.exports = QuestionList;

我已經刪除了一些功能，如加載使用jQuery的問題，並設置InitialState，在這個例子。

我能想象的WebPack不能建立像FS任何後端任務在前端的js文件或類似的東西，但它怎麼可能讀取和使用節點寫入文件， Webpack和React？這甚至有可能嗎？

來源

2016-03-14 ronnyrr

出於安全考慮，你不能在瀏覽器中使用文件系統'fs'，如果瀏覽器允許的話，那麼你可以簡單地破解你的系統。 – Vikramaditya

您找到的任何解決方案？我的意思是如何閱讀文件？ – gamer

就我所知，您不能在前端JS文件中使用fs，因爲您無法從瀏覽器訪問文件系統（看起來您可能預計readFileSync調用會得到在Webpack編譯期間運行 - 這不是它的工作原理！）。您可能需要某種Webpack加載器才能製作該文件，因此您可以使用該文件，否則您將不得不通過AJAX加載它。

來源

2016-03-14 17:04:06

使用FS文件系統的節點，Webpack和React路由

回答

相關問題