Uncaught ReferenceError: __WEBPACK_EXTERNAL_MODULE_XX__ не определен

У нас есть специальный пакет npm, our-map, который мы использовали с использованием TypeScript, webpack и API-интерфейса ArcGIS для переноса карты esri в компоненте React. Мы подтвердили, что модуль работает по назначению с тестовой страницы в модуле. То есть мы можем отобразить наш компонент React Map и правильно отобразить веб-карты. Пакет npm our-map npm записывается в общий ресурс файла, поэтому мы можем установить его в другие приложения.Uncaught ReferenceError: __WEBPACK_EXTERNAL_MODULE_XX__ не определен

У нас есть npm install ed our-map до our-app, другое приложение TypeScript. Мы используем webpack для связывания приложения. Однако во время выполнения мы получаем следующую ошибку.

Uncaught ReferenceError: __WEBPACK_EXTERNAL_MODULE_61__ is not defined

При отладке это в хроме мы находим модуль обижая быть

module.exports = __WEBPACK_EXTERNAL_MODULE_61__; 

////////////////// 
// WEBPACK FOOTER 
// external "esri/arcgis/utils" 
// module id = 61 
// module chunks = 0

Если убрать esri/arcgis/utils модуль из our-map модуля и переиздавать, мы имеем аналогичную ошибку, но, ссылаясь на следующий ESRI модуль.

Код для our-app является:

index.html

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Our Application</title> 
    </head> 

    <body> 
    <div id="header"></div> 
    <div id="content"></div> 
    <div id="footer"></div> 
    <script src="https://js.arcgis.com/3.16/"></script> 
    <script> 
      require(["dist/main.bundle.js"], function (main) {}); 
     </script> 
    </body> 
</html>

app.tsx упрощенный для ясности

import * as React from "react"; 
import {MapContainer} from "our-map"; 

export const App = (props: IApp) => { 
    return <div style={{height: "100%"}}> 
     <div style={mapStyle}> 
      <MapContainer /> 
     </div> 
    </div>; 
};

webpack.config.js

var webpack = require("webpack"); 

module.exports = { 
    entry: { 
     main: ['./src/app/main.ts', 'esri', 'esri/map', 'esri/urlUtils', 'esri/geometry/Point', 'esri/arcgis/utils'] 
    }, 
    output: { 
     filename: 'dist/[name].bundle.js' 
    }, 
    resolve: { 
     extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js'] 
    }, 
    module: { 
     loaders: [ 
      //typescript 
      { 
       test: /\.tsx?$/, 
       loader: 'ts-loader' 
      }, 
      // css 
      { 
       test: /\.css$/, 
       loader: "style-loader!css-loader" 
      }, 
      // images 
      { 
       test: /\.png$/, 
       loader: "url-loader", 
       query: { mimetype: "image/png" } 
      }, 
      // fonts 
      { 
       test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, 
       loader: "url-loader?limit=10000&name=dist/fa/[hash].[ext]&mimetype=application/font-woff" 
      }, 
      { 
       test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, 
       loader: "file-loader?name=dist/fa/[hash].[ext]" 
      } 
     ] 
    }, 
    externals: [ 
     function(context, request, callback) { 
      if (/^dojo/.test(request) || 
       /^dijit/.test(request) || 
       /^esri/.test(request) 
      ) { 
       return callback(null, "amd " + request); 
      } 
      callback(); 
     } 
    ], 
    devtool: 'source-map' 
};

Любые мысли относительно того, что может быть причиной этой проблемы и как решить ее?

источник

2016-08-23 Ryan Taylor

Решение было установлено libraryTarget: 'amd' в webpack.config.js файл следующим образом:

output: { 
    filename: 'dist/[name].bundle.js', 
    libraryTarget: 'amd' 
},

источник

2016-08-23 15:46:57

Uncaught ReferenceError: __WEBPACK_EXTERNAL_MODULE_XX__ не определен

ответ

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