5

static-site-generator-webpack-plugin に問題があります。

私のプロジェクトでは、次のものを使用しています：

  • webpack v2.1.0-beta.27
  • static-site-generator-webpack-plugin v3.1.0
  • 反応および反応-dom v15.4.1

それは単一ページのウェブサイトです。

webpack.config.babel.jsファイルの一部を次に示します。

import StaticSiteGeneratorPlugin from 'static-site-generator-webpack-plugin'
  
export default {
    entry: {
        main: './components/Root/index.jsx',
    },
    output: {
        path: path.join(process.cwd(), './public'),
        filename: '[name].[hash].js',
        libraryTarget: 'umd',
    },
  
      plugins: [
        // ...
        new StaticSiteGeneratorPlugin('main', '/', {}),
      ]
        // ...
  }

そして、これは./components/Root/index.jsxファイルです：

import React from 'react'
import ReactDOMServer from 'react-dom/server'
import HTMLDocument from 'react-html-document'

import App from '../App/index.jsx'

export default function (locals, callback) {
    const MyHtml = (
        <HTMLDocument
            title='My Page'
            metatags={[
              { name: 'description', content: 'My description' },
            ]}
            scripts={[ `${locals.assets.main}` ]}>
            <App />
        </HTMLDocument>
    )

    const html = ReactDOMServer.renderToStaticMarkup(MyHtml, locals.assets)
    callback(null, '<!doctype html>' + html)
}

使用しようとすると、次のエラー メッセージが表示されますERROR in ReferenceError: self is not defined。どういう意味ですか？

4

1 に答える 1

6

webpack-dev-serverで同じエラーが発生しました。このエラーの原因は、サーバーでのレンダリングです。サーバーにはオブジェクトselfがありません。scopeオプション ( https://github.com/markdalgleish/static-site-generator-webpack-plugin#scope ) を使用するか、サーバーで static-site-generator-webpack-plugin を使用しないようにすることができます。

このエラーを解決するためにwebpack-dev-serverを使用する場合は、設定する必要がありますinline: false( https://github.com/webpack/docs/wiki/webpack-dev-server#inline-mode )。iframe なしでルート URL でホット リロードを使用する場合は<script src="http://localhost:8080/webpack-dev-server.js"></script>、ページに追加するだけです ( https://github.com/webpack/docs/wiki/webpack-dev-server#inline-mode-in-html ) 。 .

于 2017-01-05T18:46:02.497 に答える