在服務器中加載映像時出錯AWS

我在Windows中開發了我的應用程序並在AWS Ubuntu中託管。該應用程序使用Node和React與Webpack開發。在服務器中加載映像時出錯AWS

的WebPack配置：

var debug = process.env.NODE_ENV !== "production"; 
 
var webpack = require('webpack'); 
 
var path = require('path'); 
 
var combineLoaders = require('webpack-combine-loaders'); 
 
var HtmlWebpackPlugin = require('html-webpack-plugin'); 
 

 
module.exports = { 
 
    context: path.join(__dirname, "public"), 
 
    devtool: debug ? "inline-sourcemap" : null, 
 
    entry: "./src/app/client.js", 
 
    module: { 
 
    loaders: [ 
 
     { 
 
      test: /\.jsx?$/, 
 
      exclude: /(node_modules|bower_components)/, 
 
      loader: 'babel-loader', 
 
      query: { 
 
       presets: ['react', 'es2015', 'stage-0'], 
 
       plugins: ['react-html-attrs', 'transform-class-properties', 'transform-decorators-legacy'], 
 
      } 
 
     }, 
 
     { 
 
      test: /\.css$/, 
 
      loader: combineLoaders([ 
 
      { 
 
       loader: 'style-loader' 
 
      }, { 
 
       loader: 'css-loader', 
 
       query: { 
 
       modules: true, 
 
       localIdentName: '[name]__[local]___[hash:base64:5]' 
 
       } 
 
      } 
 
      ]) 
 
     }, 
 
     { 
 
      test: /\.scss$/, 
 
      loaders: ["style-loader", "css-loader", "sass-loader"] 
 
     }, 
 
     { 
 
      test: /\.(jpe?g|png|gif|svg)$/i, 
 
      loaders: [ 
 
       'file?hash=sha512&digest=hex&name=[hash].[ext]', 
 
       'image-webpack?bypassOnDebug&optimizationLevel=7&interlaced=false' 
 
      ] 
 
     } 
 
    ] 
 
    }, 
 
    sassLoader: { 
 
    includePaths: [path.resolve(__dirname, "/public/src/styles/")] 
 
    }, 
 
    output: { 
 
    path: __dirname + "/public/src/", 
 
    filename: "client.min.js" 
 
    }, 
 
    plugins: debug ? [] : [ 
 
    new webpack.optimize.DedupePlugin(), 
 
    new webpack.optimize.OccurenceOrderPlugin(), 
 
    new webpack.optimize.UglifyJsPlugin({ mangle: false, sourcemap: false }), 
 
    ], 
 
};

應用程序工作正常，在我的地方，但不是在服務器上。我在控制檯中出現錯誤：

Header.js:5 Uncaught Error: Cannot find module "../../../images/icons/user.png" at webpackMissingModule (Header.js:5)

而且在CMD錯誤：

ERROR in ./public/src/images/icons/user.png 
Module build failed: Error: spawn  /home/ubuntu/dashboard/node_modules/pngquant-bin/vendor/pngquant ENOENT 
at exports._errnoException (util.js:1022:11) 
at Process.ChildProcess._handle.onexit (internal/child_process.js:193:32) 
at onErrorNT (internal/child_process.js:359:16) 
at _combinedTickCallback (internal/process/next_tick.js:74:11) 
at process._tickCallback (internal/process/next_tick.js:98:9) 
@ ./public/src/app/components/Dashboard/Media/Media.js 76:14-60

在我node_modules\pngquant-bin\vendor文件夾中有一個pngquant.exe文件，是創建任何問題或目錄路徑指定在webpack中？

UPDATE

console.log(process.env.NODE_ENV);給出了我的本地和服務器undefined。

來源

2017-01-10 Deepak Bandi

您在Windows操作系統中開發應用程序並希望在Ubuntu操作系統上進行部署。在將文件從Windows導入到Linux時，我也遇到了同樣的問題。

您在Windows服務器實例上部署應用程序，因爲您將在Windows操作系統中使用瀏覽器。當您導入文件時，它將像Windows Server Instance文件系統一樣獲取文件路徑。所以實際的文件可以存儲在一個實例中。文件路徑在這裏獲取問題。
如果您想要在AWS Ubuntu OS上部署應用程序，而不是通過Windows操作系統瀏覽文件，則可以將文件存儲在Ubuntu中。背後的原因是，當您瀏覽Windows操作系統時，文件路徑會發生變化。

我解決了在Windows實例中部署應用程序的問題。

來源

2017-01-10 04:07:58

感謝Kumaresh，但我想部署在Ubuntu本身。任何其他的工作？ –

在代碼中，您將獲得完整路徑的圖像並將路徑存儲爲字符串。您將字符串映像路徑傳遞到linux路徑（如/ etc/images /（string_imagepath）），那麼您將使用linux路徑存儲到s3存儲區。這可能有用！ –

在服務器中加載映像時出錯AWS

回答

相關問題