2016-08-16 3 views
1

Я пытаюсь разбить мое приложение - попытка следовать руководству по веб-папкам по инструкции (https://webpack.github.io/docs/code-splitting.html). Таким образом, у меня есть отдельный набор для моего приложения, я вижу, что в моей сборке webpack генерирует 1.bundle.js, однако он вставляет его в мой index.html с неправильным путем, а на моей консоли я вижу ошибку выборки для 1.bundle.js файл.Webpack, новый кусок загружается с неправильным путем

Так что мой WebPack конфигурации выглядит так (им просто используя Webpack: Дев сейчас):

return { 
    dev: { 
     entry: { 
      index: './client/app.jsx' 
     }, 
     output: { 
      path: path.join(__dirname, '..', '..', 'dist', 'client'), 
      publicPath: "/dist/client/", 
      filename: 'bundle.js' 
     }, 
     module: { 
      loaders: [{ 
       test: /\.jsx?$/, 
       exclude: /node_modules/, 
       loader: 'babel-loader', 
       query: { 
        presets: ['es2015'] 
       } 
      }, { 
       test: /\.json$/, 
       loader: 'json-loader' 
      }] 
     }, 
     resolve: { 
      extensions: ['', '.js', '.jsx'] 
     }, 
     resolveLoader: { 
      fallback: [path.join(__dirname, 'node_modules')] 
     }, 
     plugins: [ 
      new webpack.DefinePlugin({ 
       "process.env": { 
        "NODE_ENV": JSON.stringify("dev") 
       } 
      }) 
     ] 
    }, 

и в моей index.html я вручную добавить <script src="bundle.js"></script> и работает великолепно. Похоже, что, когда это создает сейчас, WebPack применяет свой собственный тег сценария на мой индекс, как так

<script type="text/javascript" charset="utf-8" async="" src="/dist/client/1.bundle.js"></script> 

Однако этот путь неверен, он должен быть просто src="1.bundle.js". Я попытался настроить путь и publicPath, но ничего не работает. Есть ли способ, чтобы webpack добавлял правильный путь? Благодаря!

ответ

5

Вы должны изменить publicPath для этого фрагмента:

publicPath: "/" 

Он всегда будет служить вашим ломти от корневого пути.

1

Это потому, что вы указали ссылку на publicPath. Поэтому он попытается загрузить скрипт из этого publicPath, хотя файла там нет.

publicPath Удаление может устранить ошибку

4

Несмотря на то, что на него дан ответ и принят, я предоставляю дополнительную полезную информацию для других с аналогичными проблемами.

Существует два разных назначения, для которых используются 2 параметра.

  1. Выход: путь: Каталог Расслоение файлы, указанные в разделе входа сохраняются в. Например, bundle.js для записи «entry», которую вы упомянули. В этом случае он будет сохранен в папке webconfigfolder+"../../dist/client".
  2. Выход: publicPath: Префикс каталога, который добавляется для обращения к модулю при доступе к нему из браузера. 0.bundle.js - это неназванный кусок, созданный путем разбиения кода. Он будет помещен в вывод: путь, упомянутый выше, но будет передан в ваш html, используя общедоступный путь.

Так что, если ваши файлы как в этом случае сохраняются в папке /dist/client, но index.htm подаются в /dist/client, вы должны дать публику пути как ./. Если HTM подаются с /dist, общественным путь должен указывается как ./client/.

Публичный путь полезен для кусков, созданных для асинхронной загрузки, которые динамически вызывают из браузера.

Смежные вопросы