zoukankan      html  css  js  c++  java
  • autoprefixer遇到的几个问题

    第一个就是提示“Cannot find module 'autoprefixer'”

    1602482696(1)

    这个错误是合情合理的,因为在配置里使用了postcss插件autoprefixer,但是在依赖里却没有指定它。

    然后将最新版的autoprefixer和其它提示所需的module都给配置上,再次build时还是提示错误“Error: PostCSS plugin autoprefixer requires PostCSS 8.”。

    但这个时候postcss已经是PostCSS 8了啊?

    image

    从报错的位置看到,它是从@vue/cli-service下的postcss模块报错,而不是从项目下的postcss报错。

    至于为什么会调用@vue/cli-service下的postcss模块,这里就不探究了。导致的后果就是即使项目下的postcss已经是PostCSS 8还是会报错。

    报错的原因就是找到的autoprefixer插件的postcss属性为true。

    image

    由于postcss用的是@vue/cli-service下的,接着就发现其实@vue/cli-service已经存在了autoprefixer、postcss、postcss-loader、supports-color等必须的模块。

    image

    这个时候检测出autoprefixer的postcss属性为true,说明用的是项目下10.0.1版本的autoprefixer,而不是@vue/cli-service下

    9.8.6版本的autoprefixer,因为只有10.0.1版本的autoprefixer才被设置了postcss属性且为true。

    image

    这说明在存在两份autoprefixer和postcss的情况下,@vue/cli-service构建时用的是自己目录下的postcss,而插件autoprefixer用的项目目录下的。

    这种不同路径下模块的选择是如何实现的呢?

    首先@vue/cli-service通过自己目录下的postcss-loader模块,调用应用目录下的postcss-load-config模块来加载插件。

    image

    postcss-load-config模块通过调用自己目录下的plugins.js来加载插件。

    image

    插件路径的选择就是在这个脚本中决定的,它是使用import-cwd模块来导入插件的,这也就决定了插件模块必须在应用目录下,而不能在项目的父级目录或nodejs目录下,同时即使插件模块已经存在于@vue/cli-service目录下也不可用。

    image

    至此已经调查清楚。

  • 相关阅读:
    Celery ---- 分布式队列神器 ---- 入门
    如何使用Python快速制作可视化报表----pyecharts
    django 使用 可视化包-Pyechart
    git & github 快速入门
    开发效率进阶
    windows编译 obs-studio
    python 控制vbox虚拟机
    pyqt实践——从裸机到打包安装
    测试darwin calendar 服务器
    centos 搭建 darwin calendar 服务器
  • 原文地址:https://www.cnblogs.com/StarkBrothers/p/13803300.html
Copyright © 2011-2022 走看看