《Angular之Error in ./node_modules/_css-loader@0.28.8》

Posted 2022-03-26 杨晓风-linda

前言：

   Angular是一个开箱即用的框架没问题，但同时此框架所依赖的包在不停地变换中，虽然此框架的容错性很好，然而某些依赖包的版本兼容问题还是会不定期出现。这不，2018年1月14日突然有人告诉出现问题了，如图所示：

怎么办呢？解决呗

正文：

问题暴露环境

       出现此问题是在服务器上首先暴露出来的，其次大家从SVN上全新down代码，重新下载依赖包会出现此问题，之前本地一直运行的是没有问题的。从差异入手，找出问题根源。

解决思路

       思路一：根据SVN提交记录，确定组内两名成员做了修改，进行提交，通过沟通和他们的确认，问题貌似不在他们那里。

       思路二：根据错误信息提示，依赖包css-loader和postcss-loader版本问题，通过比对可运行依赖包与最新下载无差别。

       思路三：根据错误信息提示，看到是CSS的问题，试图根据提示信息，将css文件引入一些相关项先删除，错误依旧存在

       思路四：自己不行，上网搜索，现在国内网站搜索，根据错误比对尝试了几种方案，错误依旧在，真是不离不弃啊。

       思路五：进军国外网站，毕竟Angualr目前的应用态势要广泛于国内，通过搜索，第一种方案尝试，失败，第二种方案没想到就迎来了春天，问题解决了。

解决方案

       巨人的肩膀：https://github.com/angular/angular-cli/issues/8781#issuecomment-355226128

       结合实际情况，以下是问题解决方案：

问题定位

   脚手架@angular/cli版本过高问题，脚手架1.6.4版本应用在ng4的项目上会有问题，本身@angular/cli进军1.6的版本后，应该是与ng5项目相匹配的，原先为了提供性能，ng4的项目使用ng5的脚手架，继而可能会暴露一些问题。

  解决方案步骤

如果你本地没有执行了cnpm install,这个命令，解决此问题需执行：

       1.项目负责人将package.json中@angluar/cli的引入去掉。

       2.组员从SVN上拉取最新代码后，依次执行：

       <1>cnpm install

       <2>cnpm install primeng@4.2.2

       <3>cnpm install @angular/cli@1.6.3

       至此，问题迎刃而解。

如果你本地已经执行了cnpm install,这个命令，解决此问题只需执行为：

     cnpm i @angular/cli@1.6.3  --save-dev

     以下步骤同样可以解决问题，原理是一样的，只不过这是之前按照自己的思路解决问题的步骤，大家直接执行上一句命令即刻，如果未解决问题，也可按照如下问题方式解决。

      <1>rimraf node_modules,如果本地没有rimraf,请在自己电脑安装：cnpm install rimraf -g

     <2>然后自行将package.json包里的@angluar/cli引入删除

     <3>cnpm install

     <4>cnpm install primeng@4.2.2

     <5>cnpm install @angular/cli@1.6.3

     项目可以运行了：

结语：

        问题并不可怕，可贵在于理解原理，将问题解决。