Deploy app reaction to hero with webpack issues

Question

Deploy app reaction to hero with webpack issues

I am getting some problems to deploy my response app to hero.

I created a config file config for webpack 2.

const webpack = require('webpack');
const path = require('path');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');

const nodeModulesPath = path.resolve(__dirname, 'node_modules');

const extractTextPlugin = new ExtractTextPlugin({
    filename: 'main.[hash].css'
});

const HtmlPlugin = new HtmlWebpackPlugin({
    template: 'src/index.html',
    inject: 'body',
    favicon: 'src/data/resources/img/logo/favicon.ico'
});

const ENVS = {
    'process.env': {
        'NODE_ENV': JSON.stringify('production')
    },
    __DEV__: JSON.stringify(JSON.parse(process.env.DEBUG || 'false'))
};
const PATHS = {
    app : path.join( __dirname, 'src'),
    build : path.join( __dirname, 'dist')
};

const config = {
    entry: [
        PATHS.app + "/index.js"
    ],
    output: {
        path: PATHS.build,
        filename: 'bundle.[hash].js',
        publicPath: '/',
    },
    devtool: 'source-map',
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: [nodeModulesPath],
                use: ['babel-loader']
            },
            {
                test: /\.(scss|css)$/,
                use: extractTextPlugin.extract({
                    fallback: 'style-loader',
                    use: ['css-loader', 'sass-loader']
                })
            },
            {
                test: /\.html$/,
                use: [ {
                    loader: 'html-loader',
                    options: {
                        minimize: true,
                        removeComments: true,
                    }
                }],
            },
            {
                test: /\.(jpeg|jpg|gf|png|ico|svg|woff|woff2|eot|ttf)$/,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            name: '[name].[ext]',
                            outputPath: 'img/',
                            publicPath: '/'
                        },
                    }
                ]
            }
        ]
    },
    plugins: [
        extractTextPlugin,
        HtmlPlugin,
        new webpack.optimize.UglifyJsPlugin({
            sourceMap: true,
            minimize: true,
            compress: {
                warnings: false,
            },
        }),
        new webpack.DefinePlugin(ENVS),
        new webpack.NoEmitOnErrorsPlugin(),
        new CleanWebpackPlugin(['dist']),
        new webpack.ProvidePlugin({
            '$': 'jquery',
            'jQuery': 'jquery',
            'window.jQuery': 'jquery'
        })
    ],
};

module.exports = config;

When I run npm run build

on my computer, I got no error and I have my dist directory.

But on the hero after the push, I had these magazines:

build / tmp / build_646d8d781ce9c274343ec9ce9e11f2b4

webpack -p --config webpack-production.config.js clean-webpack-plugin: / tmp / build_646d8d781ce9c274343ec9ce9e11f2b4 / dist has been removed. Hash: 2a8fc0ac2f35a1a04faf Version: webpack 2.5.1 Time: 26063ms [163] ./ ~ / jquery / dist / jquery.js 268 kB {0} [built] [190] ./ src / index.js 752 bytes {0} [ built] [191]. / ~ / babel-polyfill / lib / index.js 833 bytes {0} [built] [192]. /~/babel-polyfill/~/core-js/fn/regexp/escape.js 107 bytes {0} [built] [372] ./ ~ / babel-polyfill / ~ / core-js / shim.js 7.38 kB {0} [built] [373]. /~/bootstrap/dist/js/bootstrap.js 69.7 kB {0} [built] [374]. /~/bootstrap/dist/css/bootstrap-theme.css 41 bytes {0} [built] [375]. /~/bootstrap/dist/css/bootstrap.css 41 bytes {0} [built] [376]. /~/fixed-data-table/dist/fixed-data-table.css 41 bytes {0} [built] [392] ./ ~ / react-dom / index.js 59 bytes {0} [built] [469 ]./~/react/react.js 56 bytes {0} [built] [470]. /~/regenerator-runtime/runtime.js 24.4 kB {0} [built] [471] multi. /src/index.js 28 bytes {0} [built] [472]. /~/css-loader!./~/sass-loader/lib/loader.js!./~/bootstrap/dist/css/bootstrap-theme.css 23.1 kB [embedded] [481] ./ ~ / style-loader / addStyles.js 8.51 kB [inline] + 468 hidden modules ERROR in./src/index.js Module not found: Error: Unable to resolve './app/App' in '/ tmp / build_646d8d781ce9c274343ec9ce9e11f2b4 / src' @. / src / index.js 11: 11-31 @ multi. / src / index.js Child html-webpack-plugin for "Index.html": [0] ./ ~ / html-webpack-plugin / lib / loader.js! ./ src / index.html 658 bytes {0} [embedded] Child extract-text-webpack-plugin: [0] ./ ~ / css-loader / lib / css-base.js 2.26 kB {0 } [built] [1] ./ ~ / css-loader !./~/sass-loader/lib/loader.js!./~/fixed-data-table/dist/fixed-data-table.css 6.27 kB {0} [built-in] Child extract-text-webpack-plugin: [ 0] ./ ~ / css-loader / lib / css-base.js 2.26 kB {0} [built] [1] ./ ~ / css-loader! ./ ~ / sass-loader / lib / loader.js! ./~/bootstrap/dist/css/bootstrap-theme.css 23.1 kB {0} [built] Child extract-text-webpack-plugin: [0] ./ ~ / bootstrap / dist / fonts / glyphicons-halflings-regular .eot 57 bytes {0} [built] [1] ./ ~ / css-loader / lib / css-base.js 2.26 kB {0} [built] [2] ./ ~ / bootstrap / dist / fonts / glyphicons -halflings-regular.svg 57 bytes {0} [built] [3] ./ ~ / bootstrap / dist / fonts / glyphicons-halflings-regular.ttf 57 bytes {0} [built] [4] ./ ~ / bootstrap /dist/fonts/glyphicons-halflings-regular.woff 58 bytes {0} [built] [5] ./ ~ / bootstrap / dist / fonts / glyphicons-halflings-regular.woff2 59 bytes {0} [built] [6] ./ ~ / css-loader! ./ ~ / sass-loader / lib / loader.js! ./ ~ / bootstrap / dist / css / bootstrap.css 121 kB { 0} [built] npm ERR! Linux 3.13.0-112-generic npm ERR! ARGV "/tmp/build_646d8d781ce9c274343ec9ce9e11f2b4/.heroku/node/bin/node" "/tmp/build_646d8d781ce9c274343ec9ce9e11f2b4/.heroku/node" npm "run! node v6.10.3 npm ERR! npm v3.10.10 npm ERR! ELIFECYCLE code npm ERR!"build" npm ERR! node v6.10.3 npm ERR! npm v3.10.10 npm ERR! ELIFECYCLE code npm ERR!"build" npm ERR! node v6.10.3 npm ERR! npm v3.10.10 npm ERR! ELIFECYCLE code npm ERR!Olamee@0.1.0 build: webpack -p --config webpack-production.config.js

npm ERR! Exit status 2

These are scripts for package.json

  "scripts": {
    "start": "webpack-dev-server --config webpack-dev-server.config.js --hot --progress --colors --history-api-fallback",
    "build": "webpack -p --config webpack-production.config.js",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }