2017-03-02 37 views
0

我不能讓Heroku建立我的webpack反應應用程序出於某種原因。 似乎建立的js文件不存在。如果我在公用文件夾中放入一個test.js(不是構建的),那麼索引就會加載它。heroku不建立我的webpack應用程序

Procfile

build: npm run prod 
web: node ./server.js 

的package.json

"scripts": { 
"start": "export NODE_ENV=development&&npm run dev", 
"serve": "./node_modules/.bin/http-server -p 8080", 
"dev": " webpack-dev-server --progress --colors --port 8080", 
"build": "export NODE_ENV=development&& webpack --progress --colors", 
"prod": "export NODE_ENV=production&& webpack --progress -p", 
"copy": "node copyStatic.js", 
"lint": "eslint app/**" 
}, 
"engines": { 
"node": "7.7.0", 
"npm": "4.4.0" 
}, 

webpack.config

var webpack = require('webpack'); 
var path = require('path'); 
var autoprefixer = require('autoprefixer'); 

var BUILD_DIR = path.resolve(__dirname, 'public'); 
var APP_DIR = path.resolve(__dirname, 'app'); 
var PROD = process.env.NODE_ENV == 'production'; 

var config = { 

entry: { 
    app: PROD ? ['babel-polyfill', APP_DIR + '/index.js'] : ['babel-polyfill', APP_DIR + '/index.js', 'webpack-dev-server/client?http://0.0.0.0:8080'], 
    animations: APP_DIR + '/animations/animations.js' 
}, 
output: { 
    path: BUILD_DIR, 
    filename: "[name].js", 
}, 
plugins: [], 
module: { 
    rules: [ 
     { 
      test: /\.jsx?/, 
      include: APP_DIR, 
      use: ['babel-loader'] 
     }, 
     { 
      test: /\.scss$/, 
      use: ["style-loader", "css-loader", "sass-loader"] 
     }, 
     { 
      test: /\.css$/, 
      use: [ 
       'style-loader', 
       'css-loader?importLoaders=1', 
       'postcss-loader?sourceMap=inline' 
      ] 
     }, 
     { 
      test: /\.(ttf|eot|svg|woff(2)?)(\?[a-z0-9=&.]+)?$/, 
      use: 'file-loader' 
     }, 
     { 
      test: /\.(png|jpg|gif)$/, 
      use: 'file-loader' 
     }, 
     { test: /\.json$/, use: "json-loader" } 

    ] 

}, 
devServer: { 
    historyApiFallback: { 
     index: 'index.html' 
    } 
}, 
resolve: { 
    extensions: ['.js', '.jsx'], 
    alias: { 
     "TweenLite": path.resolve('node_modules', 'gsap/src/uncompressed/TweenLite.js'), 
     "TweenMax": path.resolve('node_modules', 'gsap/src/uncompressed/TweenMax.js'), 
     "TimelineLite": path.resolve('node_modules', 'gsap/src/uncompressed/TimelineLite.js'), 
     "TimelineMax": path.resolve('node_modules', 'gsap/src/uncompressed/TimelineMax.js') 
    } 
}, 
node: { 
    //console: 'empty', 
    fs: 'empty', 
    net: 'empty', 
    tls: 'empty' 
} 
}; 

module.exports = config; 

的WebPack配置

var BUILD_DIR = path.resolve(__dirname, 'public'); 
//////other config 
output: { 
    path: BUILD_DIR, 
    filename: "[name].js", 
}, 

在公用文件夾中的index.html中:

<script type="text/javascript" src="./app.js"></script> 
<script type="text/javascript" src="./test.js"></script> 

test.js加載。 app.js沒有。相同的設置在本地正常工作

+0

您是否檢查日誌?構建可能失敗 –

+0

是的,我可以看到它在日誌中構建,app.js 1.04 MB 0 [emit] –

+0

並且沒有錯誤,據我所見 –

回答

0

這是因爲我的buildpack配置不正確而導致的。我在應用程序設置中將其切換到heroku/nodejs,並且它可以正常工作

相關問題