Ionic-framework: PostCSS 可能会生成错误的源映射错误

创建于 2018-01-04  ·  27评论  ·  资料来源: ionic-team/ionic-framework

离子版本：（用“x”检查一个）
（对于 Ionic 1.x 问题，请使用 https://github.com/ionic-team/ionic-v1）
[ ] 2.x
[x] 3.x
[] 4.x

我正在提交一个 ... （用“x”检查一个）
[x] 错误报告
[ ] 功能要求

请不要在此处提交支持请求或“如何”问题。 相反，请使用以下渠道之一： https : http://ionicworldwide.herokuapp.com/

当前行为：
如果我们使用您的空白启动器或任何其他构建 Android 应用程序的模板构建一个新应用程序，我们将遇到此错误

[16:52:18]  sass started ... 
Witout `from` option PostCSS could generate wrong source map or do not find Browserslist config. Set it to CSS file path or to `undefined` to prevent this warning
[16:52:19]  sass finished in 1.13 s

预期行为：
错误消息不应该是

重现步骤：
使用创建一个新的空白应用程序
ionic start postcss
构建 android 应用程序
ionic cordova build android

您可以看到带有警告或错误消息的日志

[16:57:54]  sass started ... 
Witout `from` option PostCSS could generate wrong source map or do not find Browserslist config. Set it to CSS file path or to `undefined` to prevent this warning
[16:57:55]  sass finished in 793 ms

离子信息：（从终端/cmd 提示符运行ionic info并粘贴下面的输出）：

cli packages: (/usr/lib/node_modules)

    @ionic/cli-utils  : 1.19.0
    ionic (Ionic CLI) : 3.19.0

global packages:

    cordova (Cordova CLI) : 8.0.0 

local packages:

    @ionic/app-scripts : 3.1.6
    Cordova Platforms  : android 7.0.0
    Ionic Framework    : ionic-angular 3.9.2

System:

    Android SDK Tools : 26.1.1
    Node              : v8.9.4
    npm               : 5.6.0 
    OS                : Linux 4.13

Environment Variables:
    ANDROID_HOME : /abcdef/android/sdk

Misc:
    backend : legacy
picture mburger81
👍47

最有用的评论

在修复此问题之前，一种可能性是在引入错误之前恢复一些补丁：

npm i -D -E [email protected]

PostCSS 的 CHANGELOG.md

6.0.16
修复警告文本（由 Michael Keller）。
6.0.15
在 process().then() 调用上添加有关错过选项的警告。
添加 IE 10 支持。

https://github.com/postcss/postcss/blame/master/lib/lazy-result.es6#L192

在： ionic-app-scripts 的 package.json
这个"postcss": "^6.0.13"也安装了新的补丁6.0.15 ，它有新的警告。

picture StefanRein 于 2018-01-09
👍19 ❤1 🎉1

所有27条评论

正如警告所说：

如果没有from选项，PostCSS 可能会生成错误的源映射或找不到 Browserslist 配置。 将其设置为 CSS 文件路径或undefined以防止出现此警告

我添加了字段from并将其设置为未定义并创建了一个拉取请求。

https://github.com/StefanRein/ionic-app-scripts/blob/29873ae96611ae209ca4b065fd9940d6b7b96bda/src/sass.ts#L285

这解决了这个警告。 但我不知道这是否有进一步的后果，Ionic 团队需要在那里填写生成的 css 文件的路径或类似的东西。

@danbucholtz你能回顾一下吗？ 因此，我们的自动化构建失败了。
（“警告”被解释为错误..）

编辑：PostCSS 最终使用 console.warn，但这会在节点上运行到 stderr 管道，而我们的 TeamFS 失败了。

stderr用于警告或错误输出。 来源

StefanRein picture StefanRein 于 2018-01-09

在修复此问题之前，一种可能性是在引入错误之前恢复一些补丁：

npm i -D -E [email protected]

PostCSS 的 CHANGELOG.md

6.0.16
修复警告文本（由 Michael Keller）。
6.0.15
在 process().then() 调用上添加有关错过选项的警告。
添加 IE 10 支持。

https://github.com/postcss/postcss/blame/master/lib/lazy-result.es6#L192

在： ionic-app-scripts 的 package.json
这个"postcss": "^6.0.13"也安装了新的补丁6.0.15 ，它有新的警告。

StefanRein picture StefanRein 于 2018-01-09
👍19 ❤1 🎉1

这是固定的吗？

thezakman picture thezakman 于 2018-01-18

@thezakman还没有。 这个问题是开放的。 警告仍然存在。

StefanRein picture StefanRein 于 2018-01-18
👍9 😕4 🎉3

找到 sass.js 文件。 在 /node_modules/@ionic/app-scripts/dist/sass.js 下。
找到 var postcssOptions 并添加：undefined,

最后应该是这样的：
var postcssOptions = {
来自：未定义，
到：path_1.basename(sassConfig.outFile),
地图：autoPrefixerMapOptions
};

AlbenJohn picture AlbenJohn 于 2018-01-20
👍13 🎉3 😕1

https://github.com/ionic-team/ionic-app-scripts/pull/1364#issuecomment -358557878

您不应修改 node_modules 目录中的任何文件。 如果您更新软件包，重新安装它们，将它们安装在新项目中，则任何修改都将消失。

请暂时使用上面的建议。

StefanRein picture StefanRein 于 2018-01-20
👍3

我用这个解决了问题（thanx也给@AlbenJohn）
https://stackoverflow.com/a/48315414

hanifmazlan picture hanifmazlan 于 2018-02-01
👍1

有什么解决办法吗？

polfernandez picture polfernandez 于 2018-02-15

虽然它没有破坏我的构建，但这个警告也会出现在我身上。 这是一个单行快速修复，是否已经有一个拉取请求？

johnroper100 picture johnroper100 于 2018-02-24

@johnroper100是的，它已获得批准（上面有链接）。

编辑：地图文件工作正常。

StefanRein picture StefanRein 于 2018-02-25

这个警告仍然出现。

JosepAlacid picture JosepAlacid 于 2018-03-19
👍7

这个警告仍然出现。

Veyhunk picture Veyhunk 于 2018-04-06
👍3

此警告仍然出现。

ajmalhassan picture ajmalhassan 于 2018-04-14
😄3 🎉2

@JosepAlacid @Veyhunk @ajmalhassan尝试使用@hanifmazlan建议的修复程序。 它实际上对我有用。 https://stackoverflow.com/a/48315414/3288671

nickthakkar picture nickthakkar 于 2018-04-16

没错，确实如此，但正如@StefanRein 所暗示的那样，它离任何类似生产的环境仍然很远。 最好避免使用 node_modules。 仍在等待适当的修复。 Ionic 团队有任何更新吗？

bobbino picture bobbino 于 2018-04-18

这个警告仍然出现。

kirillgroshkov picture kirillgroshkov 于 2018-05-11

这个警告仍然出现。

ElissandroMendes picture ElissandroMendes 于 2018-05-14

这个警告仍然出现。

thorizer picture thorizer 于 2018-05-20

这个警告仍然出现。

indian-boy picture indian-boy 于 2018-05-20

这个警告仍然出现。

Ruslancic picture Ruslancic 于 2018-05-21

请停下。 这没有任何帮助。
这是一个开源项目。 如果人们有时间，他们会修复它。
上面提到了解决警告的解决方案。

虽然我不想代表 IONIC 团队发言，但我觉得这里有必要说一下：

与说“此警告仍然出现”的评论数量成比例，此问题并没有接近解决。 /“对此的任何更新”/“对此的任何修复”/等。

如果您被卡住了，请阅读该主题 - 有一种解决方法，顾名思义，可以让您工作。 如果您想获得有关此方面的更新，请单击“订阅”按钮保存一些按键操作，这样您就可以在电子邮件中接收更新。 每次有人评论“对此有任何更新吗？”时，您也会收到更新，所以请不要成为那个人。

StefanRein picture StefanRein 于 2018-05-31
👎5 👍5

这个警告仍然出现。

jhonnhenry picture jhonnhenry 于 2018-06-08
👎5 👍1

@jhonnhenry老兄，是认真的吗？ 我们知道 - 问题仍然存在。 只需订阅并继续前进......

如果您坚持发表评论，请提供一些见解（例如您正在运行的版本），帮助我们提高工作效率。

emcniece picture emcniece 于 2018-06-08
👍2

我找到了这个解决方法

首先在/node_modules/@ionic/app-scripts/dist/sass.js下找到sass.js文件。 内部搜索 var postcssOptions 并添加自：未定义，

最后应该是这样的：

var postcssOptions = {
来自：未定义，
到：path_1.basename(sassConfig.outFile),
地图：autoPrefixerMapOptions
};

https://stackoverflow.com/questions/48162738/without-from-option-postcss-could-generate-wrong-source-map-or-do-not-find-bro

islameg26 picture islameg26 于 2018-08-06
😕4 👎2

还是得到了他的警告。 跳入 node_modules 并不严重 ::/

trsh picture trsh 于 2018-11-30
👍1

感谢您的问题！ 我们已经将 Ionic 3 的源代码和问题移到了一个单独的存储库中。 我正在将此问题移至 Ionic 3 的存储库。请在那里跟踪此问题。

感谢您使用 Ionic！

ionitron-bot[bot] picture ionitron-bot[bot] 于 2018-12-08

问题移至： https :

ionitron-bot[bot] picture ionitron-bot[bot] 于 2018-12-08
此页面是否有帮助？
0 / 5 - 0 等级

相关问题

MrBokeh picture MrBokeh  ·  3评论
daveshirman picture daveshirman  ·  3评论
masimplo picture masimplo  ·  3评论
RobFerguson picture RobFerguson  ·  3评论
manucorporat picture manucorporat  ·  3评论