代码拆分后，构建文件不会部署到 heroku

Question

我最近应用了代码拆分，我正在使用 CRA(create-react-app)。

之后，我将构建文件部署到 heroku，但收到此错误消息。

 error An unexpected error occurred: 
 "/tmp/build_bfd38a5e7aeec15ffefbe9481e36ace7/node_modules/uglifyjs-
 webpack-plugin: EROFS: read-only file system, access '/usr/local/bin'".

我认为这主要是因为我的 bundle.js 被分成了 4 个独立的块，这极大地改变了包文件。

有关更多信息，这是我的 asyncComponent.js 和 App.js。

// asyncComponent.js
import React, { Component } from 'react';

export default function asyncComponent (getComponent) {
    return class AsyncComponent extends Component {
        static Component = null;
        state = {
            Component: AsyncComponent.Component
        };

        componentWillMount () {
            if (!this.state.Component) {
                getComponent().then(({ default: Component }) => {
                    AsyncComponent.Component = Component;
                    this.setState({ Component });
                });
            }
        }

        render () {
            const { Component } = this.state;

            return Component && <Component {...this.props} />
        }
    };
}

// App.js
import asyncComponent from './lib/asyncComponent';

const AsyncHome = asyncComponent(() => import('./pages/Home'));

class App extends Component {
  render() {
    return (
      <Provider store={store}>
        <Router>
          <div>
            <Switch>
              <Route exact path="/" component={ AsyncHome } />
            </Switch>
          </div>
        </Router>
      </Provider>
    );
  }
}

export default App

Answer 1

我遇到了同样的问题。它似乎与 Yarn v1.0.0 有关。如果您明确将 yarn 引擎设置为 0.28.4，您的构建应该会再次运行。请参阅此相关 GitHub 问题：heroku-buildpack-nodejs 468

在你的package.json中：

"engines": {
    "yarn": "0.28.4"
}

代码拆分后，构建文件不会部署到 heroku

After code-splitting, build files aren't deployed to heroku

heroku

uglifyjs