如何配置角度7的自动重定位器？

Question

我在角7项目中使用自动重定位。但是，当我打开browser devtools并用类“simple”聚焦元素时(它的应用样式是显示flex )，就没有预期的‘前缀’了。在角度4-6的项目中，这是可行的。

步骤1:运行ng服务步骤2:打开browser devtools，并将元素的焦点放在"simple-content“类中，该类具有display:flex。

在package.json我有

 {
    "browserslist": [
    "last 1 version",
    "> 1%"
    ]
  }. 

In package-lock.json I have 

    "autoprefixer": {
      "version": "9.4.4",
      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-9.4.4.tgz",
      "integrity": "sha512-7tpjBadJyHKf+gOJEmKhZIksWxdZCSrnKbbTJNsw+/zX9+f//DLELRQPWjjjVoDbbWlCuNRkN7RfmZwDVgWMLw==",
      "requires": {
        "browserslist": "^4.3.7",
        "caniuse-lite": "^1.0.30000926",
        "normalize-range": "^0.1.2",
        "num2fraction": "^1.2.2",
        "postcss": "^7.0.7",
        "postcss-value-parser": "^3.3.1"
      },

我尝试使用/*自动修复器启用柔性盒的自动修复: on */，但没有结果。

在css文件中

.simple-content {
    display: flex;
}

预期结果：

.simple-content {
  display: -webkit-box;    
  display: -moz-box;      
  display: -ms-flexbox;   
  display: -webkit-flex;   
  display: flex;             
}

Answer 1

我尝试了联机自动修复工具(https://autoprefixer.github.io/)来测试您在package.json中使用的浏览器列表，并注意到它没有生成前缀css：

​

当将浏览器列表值更改为最后2个版本的时，它将生成自动修复的css：

​

所以您的package.json看起来很好，您可以通过更新浏览器列表来尝试它。

另外，角CLIV7.3.5添加了src/browserslist，这意味着您不需要为Range7项目向package.json添加.browserslistrc或浏览器列表属性。您所需要做的就是删除最后一行的而不是，以支持IE9-11。