2016-11-27 7 views
2

У меня есть проблема с static-site-generator-webpack-plugin.Webpack 2: static-site-generator-plugin "self не определен"

В моем проекте я использую:

  • WebPack v2.1.0-beta.27
  • статический сайт-генератор WebPack-плагин v3.1.0
  • реагируют и реагируют-РОМ 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. Что это значит?

ответ

3

У меня была такая же ошибка с webpack-dev-server. Причиной этой ошибки является рендеринг на сервере. На сервере нет объекта self. Вы можете использовать опцию scope (https://github.com/markdalgleish/static-site-generator-webpack-plugin#scope) или просто не использовать статический сайт-генератор-webpack-плагин на сервере.

Если вы используете WebPack-DEV-сервер решить эту ошибку вы должны установить inline: false (https://github.com/webpack/docs/wiki/webpack-dev-server#inline-mode). Если вы хотите использовать Горячую перезагрузку в своем корневом URL, без iframe, просто добавьте <script src="http://localhost:8080/webpack-dev-server.js"></script> на свою страницу (https://github.com/webpack/docs/wiki/webpack-dev-server#inline-mode-in-html).

+0

Сложная функция 'inline: false' решена. Не могу поверить в это. Вы, Ден, заслуживаете печенья. – Birowsky