安装后 webpack 无法在 Heroku 上运行

Posted

技术标签:

【中文标题】安装后 webpack 无法在 Heroku 上运行【英文标题】:postinstall webpack not working on Heroku 【发布时间】:2016-05-24 08:24:45 【问题描述】:

我使用 Heroku 来托管我的应用,并使用 webpack 来构建它。

基本上,我正在尝试部署我的应用,但它根本不起作用。

似乎没有发生后安装,因为当我加载页面时它缺少文件 bundle.js(通过 webpack 构建)。

这是我的package.json 脚本:

"main": "server.js",
"scripts": 
    "dev": "webpack-dev-server --devtool eval --content-base build/ --colors --hot",
    "start": "node server.js",
    "postinstall": "webpack -p --config webpack.prod.config.js --progress"

当我将我的项目推送到 heroku 时,在此过程中没有显示错误。我可以在控制台中看到它正在运行我的 postinstall:

远程:> pistou@1.0.0 安装后 /tmp/build_80dea0f9774d7a9a5f8f33ee9c913bca 远程:> webpack -p --config webpack.prod.config.js --progress

这是我的整个webpack.prod.config.js 文件:

var path = require('path');
var webpack = require('webpack');
var node_dir = path.resolve(__dirname, 'node_modules');

module.exports = 
    entry: [
        'unveil',
        path.resolve(__dirname, 'app/main.js')
    ],
    output: 
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js',
        publicPath: '/'
    ,
    module: 
        loaders: [
            
                test: /\.jsx?$/,
                include: path.join(__dirname, 'app'),
                loader: 'babel'
            ,
            
                test: /\.scss$/,
                include: path.join(__dirname, 'app/styles'),
                loader: 'style!css!sass'
            ,
            
                test: /\.(png|jpg)$/,
                loader: "file"
            ,
             test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,  loader: "url?limit=10000&mimetype=application/font-woff" ,
             test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/font-woff" ,
             test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,   loader: "url?limit=10000&mimetype=application/octet-stream" ,
             test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,   loader: "url?limit=10000&mimetype=image/svg+xml" ,
             test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,   loader: "file" 
        ]
    ,
    plugins: [
        new webpack.NoErrorsPlugin(),
        new webpack.ProvidePlugin(
            $: "jquery",
            jQuery: "jquery",
            "window.jQuery": "jquery",
        ),
        new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /(fr|en)$/),
        new webpack.DefinePlugin(
            "process.env": 
                "NODE_ENV": JSON.stringify("production")
            
        ),
        new webpack.optimize.UglifyJsPlugin(
            minimize: true,
            compress: 
                warnings: false
            
        ),
    ],
    resolve: 
        alias: 
            "unveil": "./app/statics/jquery.unveil.js",
        
    ,
;

【问题讨论】:

webpack 是否安装正确?如果它在您的devDependencies 中,您需要heroku config:set NPM_CONFIG_PRODUCTION=false。您应该在生产中删除 webpack.NoErrorsPlugin,这样您的构建就不会静默失败,并且您可以看到您可能缺少的错误 @topheman 你是对的,有一个静默错误正在运行。谢谢! 谢谢!设置该配置使我的构建通过。这应该在文档中 很抱歉打扰了一篇旧帖子,但是@topheman 如果你发布了这个问题的答案会很棒,它对我有很大帮助:^) 【参考方案1】:

--progress 标志会导致 Heroku 不喜欢的大量打印语句和日志消息,并使进程崩溃。尝试在没有 --progress 标志的情况下运行

【讨论】:

以上是关于安装后 webpack 无法在 Heroku 上运行的主要内容,如果未能解决你的问题,请参考以下文章

如何使用 Webpack Encore 在 Heroku 上编译资产?

如何使用Webpack Encore在Heroku上编译资产?

Heroku CLI 命令在安装后无法识别

在heroku上部署Nodejs+Express+React+Webpack应用

如何将使用 Webpack 的节点部署到 heroku

Heroku 上的 webpack 和 django:collectstatic 之前的捆绑