Question

出于某种原因，我在运行npm install @ ionic / app-scripts @ latest --save --save-exact

后终端出现此错误

配置文件中有错误＆＃34; C：\项目\ myproject的\配置\ webpack.config.js＆＃34 ;.而是使用默认值。 TypeError：无法读取属性＆＃39; push＆＃39;未定义的在对象。（C：\项目\ myproject的\配置\ webpack.config.js：5：22）在Module._compile（module.js：570：32）在Object.Module._extensions..js（module.js：579：10）在Module.load（module.js：487：32）在tryModuleLoad（module.js：446：12）在Function.Module._load（module.js：438：3）在Module.require（module.js：497：17） at require（internal / module.js:20:19） at Object.fillConfigDefaults（C：\ Projects \ myproject \ node_modules \ @ionic \ app-scripts \ dist \ util \ config.js：316：26）

webpack.DefinePlugin和@ ionic / app-scripts @ latest是否存在兼容性问题

这是我的webpack.config.js

const webpackConfig = require("../node_modules/@ionic/app-
scripts/config/webpack.config");
const webpack = require("webpack");
const ENV = process.env.IONIC_ENV; 
const envConfigFile = require(`./config-${ENV}.json`);
webpackConfig.plugins.push(
    new webpack.DefinePlugin({
           webpackGlobalVars: {
             apiUrl: JSON.stringify(envConfigFile.apiUrl)
           }
     })
 );

here is my service

 import { Injectable } from "@angular/core";

 declare const webpackGlobalVars: any;

 @Injectable()
 export class ConfigurationService {
    public static apiUrl = webpackGlobalVars.apiUrl;

 }

这是我在控制台中的错误。

configuration.service.ts:7未捕获的ReferenceError：未定义webpackGlobalVars 在Object.81（configuration.service.ts:7）在 webpack_require （bootstrap 09563358e6ae30fad5cb：54）在Object.225（data.service.ts:25）在 webpack_require （bootstrap 09563358e6ae30fad5cb：54）在Object.205（main.js：1228）在 webpack_require （bootstrap 09563358e6ae30fad5cb：54）在webpackJsonpCallback（bootstrap 09563358e6ae30fad5cb：25）在main.js：1 81 @ configuration.service.ts：7 webpack_require @ bootstrap 09563358e6ae30fad5cb：54 225 @ data.service.ts:25 webpack_require @ bootstrap 09563358e6ae30fad5cb：54 205 @main.js：1228 webpack_require @ bootstrap 09563358e6ae30fad5cb：54 webpackJsonpCallback @ bootstrap 09563358e6ae30fad5cb：25 （匿名）@main.js：1

Answer 1

阅读此CHANGELOG

重大变化
webpack配置格式从导出为配置字典的配置更改为。
基本上， 默认配置现在导出dev和prod属性，并为每个 分配一个配置。查看更改here的示例。此更改为为下一个应用程序脚本发布添加多个“环境”支持奠定了基础。

所以现在要求webpackConfig导出一个类似于此{ dev: devConfig, prod: prodConfig }

的对象

您发布的代码中的更改：

const webpackConfig = require("../node_modules/@ionic/app-scripts/config/webpack.config");
...
webpackConfig.plugins.push( ... ); // --> webpackConfig[ENV].plugins.push( ... );

无法获取webpack.DefinePlugin变量

1 个答案: