javascript - Why does the code packaged with webpack report an error when using the fs module of node?

WBOY

Release： 2016-09-19 09:16:42

Original

2952 people have browsed it

<code>var fs   = require("fs");
var path = require('path');

下面的path模块就没问题，fs直接就报错了，什么情况？

    
> own@1.0.0 start C:\Users\gao\Desktop\github项目学习\backbone-resume-generator-master
> node server.js
Thu, 15 Sep 2016 13:01:33 GMT body-parser deprecated bodyParser: use individual json/urlencoded middlewares at server.js:16:9
Thu, 15 Sep 2016 13:01:33 GMT body-parser deprecated undefined extended: provide extended option at node_modules\body-parser\index.js:105:29
> Listening on port 3000. Open up http://localhost:3000/ in your browser.
Hash: 95b9374fe25b22ba4922
Version: webpack 1.13.2
Time: 978ms
    Asset     Size  Chunks             Chunk Names
bundle.js   439 kB    0, 1  [emitted]  main
vendor.js  3.52 kB       1  [emitted]  vendor
chunk    {0} bundle.js (main) 423 kB {1} [rendered]
    [0] ./public/js/app.js 1.55 kB {0} [built]
    [1] ./~/backbone/backbone.js 72.2 kB {0} [built]
    [2] ./~/underscore/underscore.js 52.9 kB {0} [built]
    [3] ./~/jquery/dist/jquery.js 264 kB {0} [built]
    [4] ./public/js/utils.js 1.02 kB {0} [built]
    [5] ./public/js/views ^\.\/.*$ 289 bytes {0} [built]
    [6] ./public/js/views/form.js 3.96 kB {0} [built]
    [7] ./public/js/views/item.js 1.87 kB {0} [built]
    [8] ./public/js/models/items.js 322 bytes {0} [built]
    [9] ./public/js/views/list.js 2.24 kB {0} [built]
   [10] ./public/js/models/main.js 1.63 kB {0} [built]
   [11] ./~/backbone.localstorage/backbone.localStorage.js 7.45 kB {0} [built]
   [12] ./public/js/views/resume.js 1.68 kB {0} [built]
   [13] ./public/js/views/main.js 490 bytes {0} [built] [1 error]
   [14] (webpack)/~/node-libs-browser/~/path-browserify/index.js 6.18 kB {0} [built]
   [15] (webpack)/~/node-libs-browser/~/process/browser.js 5.3 kB {0} [built]
chunk    {1} vendor.js (vendor) 0 bytes [rendered]
ERROR in ./public/js/views/main.js
Module not found: Error: Cannot resolve module 'fs' in C:\Users\gao\Desktop\github项目学习\backbone-resume-generator-master\public\js\views
 @ ./public/js/views/main.js 1:11-24
</code>

Copy after login

webpack configuration

<code>var webpack = require('webpack');
var path = require('path');

module.exports = {
    entry: './public/js/app.js',
    output: {
        path: path.join(__dirname, 'dist'),
        filename: 'bundle.js',
        publicPath: '/static/',
        vendor: ['jquery', 'backbone', 'underscore']
    },
    plugins: [
        new webpack.ProvidePlugin({
            $: "jquery",
            Backbone: "backbone",
            _: "underscore"
        }),
        new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.js')
    ]</code>

Copy after login

Reply content:

<code>var fs   = require("fs");
var path = require('path');

下面的path模块就没问题，fs直接就报错了，什么情况？

    
> own@1.0.0 start C:\Users\gao\Desktop\github项目学习\backbone-resume-generator-master
> node server.js
Thu, 15 Sep 2016 13:01:33 GMT body-parser deprecated bodyParser: use individual json/urlencoded middlewares at server.js:16:9
Thu, 15 Sep 2016 13:01:33 GMT body-parser deprecated undefined extended: provide extended option at node_modules\body-parser\index.js:105:29
> Listening on port 3000. Open up http://localhost:3000/ in your browser.
Hash: 95b9374fe25b22ba4922
Version: webpack 1.13.2
Time: 978ms
    Asset     Size  Chunks             Chunk Names
bundle.js   439 kB    0, 1  [emitted]  main
vendor.js  3.52 kB       1  [emitted]  vendor
chunk    {0} bundle.js (main) 423 kB {1} [rendered]
    [0] ./public/js/app.js 1.55 kB {0} [built]
    [1] ./~/backbone/backbone.js 72.2 kB {0} [built]
    [2] ./~/underscore/underscore.js 52.9 kB {0} [built]
    [3] ./~/jquery/dist/jquery.js 264 kB {0} [built]
    [4] ./public/js/utils.js 1.02 kB {0} [built]
    [5] ./public/js/views ^\.\/.*$ 289 bytes {0} [built]
    [6] ./public/js/views/form.js 3.96 kB {0} [built]
    [7] ./public/js/views/item.js 1.87 kB {0} [built]
    [8] ./public/js/models/items.js 322 bytes {0} [built]
    [9] ./public/js/views/list.js 2.24 kB {0} [built]
   [10] ./public/js/models/main.js 1.63 kB {0} [built]
   [11] ./~/backbone.localstorage/backbone.localStorage.js 7.45 kB {0} [built]
   [12] ./public/js/views/resume.js 1.68 kB {0} [built]
   [13] ./public/js/views/main.js 490 bytes {0} [built] [1 error]
   [14] (webpack)/~/node-libs-browser/~/path-browserify/index.js 6.18 kB {0} [built]
   [15] (webpack)/~/node-libs-browser/~/process/browser.js 5.3 kB {0} [built]
chunk    {1} vendor.js (vendor) 0 bytes [rendered]
ERROR in ./public/js/views/main.js
Module not found: Error: Cannot resolve module 'fs' in C:\Users\gao\Desktop\github项目学习\backbone-resume-generator-master\public\js\views
 @ ./public/js/views/main.js 1:11-24
</code>

Copy after login

webpack configuration

<code>var webpack = require('webpack');
var path = require('path');

module.exports = {
    entry: './public/js/app.js',
    output: {
        path: path.join(__dirname, 'dist'),
        filename: 'bundle.js',
        publicPath: '/static/',
        vendor: ['jquery', 'backbone', 'underscore']
    },
    plugins: [
        new webpack.ProvidePlugin({
            $: "jquery",
            Backbone: "backbone",
            _: "underscore"
        }),
        new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.js')
    ]</code>

Copy after login

Tell me first:

Why do front-end projects reference the fs module?