ERROR in ./node_modules/css-loader!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-a5e4f82a","scoped":false,"hasInlineConfig":false}!./node_modules/stylus-loader?{"import":["~@didi/ada/style/mixins.styl","/home/xiaoju/manhattan-hera-webapp/client/style/base.styl"]}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0&bustCache!./client/components/panel_links.vue
Cannot find module 'postcss-import'
@ ./node_modules/style-loader!./node_modules/css-loader!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-a5e4f82a","scoped":false,"hasInlineConfig":false}!./node_modules/stylus-loader?{"import":["~@didi/ada/style/mixins.styl","/home/xiaoju/manhattan-hera-webapp/client/style/base.styl"]}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0&bustCache!./client/components/panel_links.vue 4:14-454
@ ./client/components/panel_links.vue
@ ./client/app.ts
@ multi ./client/app.ts

如下图:

在测试项目的时候,部署前端在启动前端环境的时候遇到缺少组件css-loader,/style-compiler,stylus-loader,尝试了开启外网,npm的全局安装,单独安装组件( npn install stylus-loader css-loader style-loader style-compiler  --save-dev)后无果,最后在前端大神的指导下,发现是npm的目录没有权限,然后找到了破解npm无法全局安装下载的最新办法!亲测有效!

方法一:

更改npm的默认安装目录

1、为全局安装创建一个安装目录

  mkdir ~/.npm-global

2、配置npm以使用新的目录路径

  npm config set prefix '~/.npm-global'

3、打开或创建一个~/.profile文件并添加以下行

  export PATH=~/.npm-global/bin:$PATH

4、然后全局安装npm即可

  npm install

5、然后你惊奇的会发现之前全局安装不下来的东西都可以下载下来了

    在success出现的那一刻,会觉得整个虚拟机都美艳不可方物~

方法二:使用节点版本管理器重新安装(高效适合高手)

1、由于npm和node.js产品由不同的实体管理,因此更新和维护可能变得复杂。此外,Node.js安装过程将npm安装在仅具有本地权限的目录中。当您尝试全局运行包时,这可能会导致权限错误。

为了解决这两个问题,许多开发人员选择使用节点版本管理器nvm来安装npm。版本管理器将避免权限错误,并将解决更新Node.js和npm的复杂性。

此外,开发人员可以使用nvm在多个版本的npm上测试他们的应用程序。nvm使您可以轻松切换npm以及节点版本。这样可以更轻松地确保您的应用程序适用于大多数用户,即使他们使用的是其他版本的npm。如果您决定安装版本管理器,请使用您选择的版本管理器的说明来学习如何切换版本,并了解如何使用最新版本的npm保持最新。

nvm如何安装具体请参考

https://github.com/creationix/nvm/blob/master/README.md#installation

2、安装完之后验证登陆系统将提示您输入用户名,密码和电子邮件。请务必使用与在网站上输入的用户名完全相同的方式拼写您的用户名,否则您将创建一个新帐户。

  npm login

3、要测试您是否已成功登录

  npm whoami

4、然后尝试更新你的npm版本

  npm install npm@next -g


声明:本文为博主学习感悟总结,水平有限,如果不当,欢迎指正。如果您认为还不错,欢迎转载。转载与引用请注明作者及出处。

npm缺少css-loader,/style-compiler,stylus-loader问题,npm没有权限无法全局更新问题【已解决】的更多相关文章

  1. node作为前台的项目如何打包静态js和css并生成版本号,loader插件的使用

    一.使用场景: 1.node创建的前台项目需要输入地址展示页面 2.有设置缓存或者cdn的需要在静态文件更改时能使用新的而不是缓存的,需要版本号这里 3.可能需要压缩静态文件的 二.一些参考地址,需要 ...

  2. 63(原67).纯 CSS 创作单元素点阵 loader

    原文地址:https://segmentfault.com/a/1190000015444368 感想:CSS又一次让我见识到它的强大之处 --> box-shadow . box-shadow ...

  3. 2.纯 CSS 创作一个矩形旋转 loader 特效

    原文地址:2.纯 CSS 创作一个矩形旋转 loader 特效 扩展后地址:https://scrimba.com/c/cNJVWUR  扩展地址:https://codepen.io/pen/ HT ...

  4. 如何用纯 CSS 创作单元素点阵 loader

    效果预览 在线演示 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览.https://codepen.io/comehope/pen/YvBvBr 可交互视频 此 ...

  5. 前端每日实战:67# 视频演示如何用纯 CSS 创作单元素点阵 loader

    效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览.https://codepen.io/comehope/pen/YvBvBr 可交互视频 此视频是可以 ...

  6. 【踩坑记录】vue单个组件内<style lang="stylus" type="text/stylus" scoped>部分渲染失效

    vue组件化应用,近期写的单个组件里有一个的渲染部分样式渲染不上去 因为同结构的其他组件均没有问题,所以排除是.vue文件结构的问题,应该是<style>内部的问题 <style l ...

  7. CSS Counter Style试玩儿

    2015年2月3日,CSS Counter Style level3成为了W3C的候选标准,是时候来一探究竟,看看强大魔力的@counter-style如何自定义list-style和counter. ...

  8. [Coding Style] CSS coding style

    CSS coding style Note 结合实际工作中的规范和推荐大家使用的CSS书写规范.顺序这篇文章整合而成 Navigation CSS 书写顺序 CSS 常用文件命名 CSS 常用命名规范 ...

  9. how to overwrite css !important style

    how to overwrite css !important style css !important bug how to override css !important style https: ...

随机推荐

  1. Java语言

    Java语言基础教程 本文将放入菜单栏中方便学习,记得点赞哦! Java分为3个体系,为JavaSE,JavaEE,JavaME,是一种面向对象的程序设计语言,记住Oracle公司收购了 Sum公司, ...

  2. [Swift]LeetCode57. 插入区间 | Insert Interval

    Given a set of non-overlapping intervals, insert a new interval into the intervals (merge if necessa ...

  3. 单机部署redis5.0集群环境

    #安装rediscd redis-5.0.0makemake install #部署集群mkdir redis_clustermkdir -p redis_cluster/{7000,7001,700 ...

  4. qt 拖拽 修改大小

    写次篇文章之前,qt窗口的放大缩小和拖拽我都是通过setGeometry方法实现的,但是作为windows程序,windows支持橡 皮筋式(拖拽时有一个虚框)拖拽和拉伸.通过setGeometry方 ...

  5. 『数组的最大代价 贪心优化DP』

    数组的最大代价(51nod 1270) Description 数组A包含N个元素A1, A2......AN.数组B包含N个元素B1, B2......BN.并且数组A中的每一个元素Ai,都满足1 ...

  6. 如何以管理员身份运行cmd

    点击屏幕最左下角的“开始”按钮,选择“运行”命令:   在弹出的“运行”对话框中输入“CMD”命令,再单击“确定”按钮:   正常打开了DOS命令提示符窗口了.但是是“user”权限下:   有时,“ ...

  7. 知其所以然~redis的原子性

    原子性 原子性是数据库的事务中的特性.在数据库事务的情景下,原子性指的是:一个事务(transaction)中的所有操作,要么全部完成,要么全部不完成,不会结束在中间某个环节. 对于Redis而言,命 ...

  8. [Leetcode]112. Path Sum -David_Lin

    Given a binary tree and a sum, determine if the tree has a root-to-leaf path such that adding up all ...

  9. .NetCore&Linux&Docker&Portainer踩坑历险记

    最近有一个云服务器和数据库的迁移任务,踩坑爬坑无数次,觉得必须要记录一下.大家瓜子花生准备好,听我慢慢讲故事#手动笑哭#. 故事背景 公司是做电商业务的,在天猫有几家旗舰店数据量也很大.阿里有一个称为 ...

  10. salesforce lightning零基础学习(十三) 自定义Lookup组件(Single & Multiple)

    上一篇简单的介绍了自定义的Lookup单选的组件,功能为通过引用组件Attribute传递相关的sObject Name,捕捉用户输入的信息,从而实现搜索的功能. 我们做项目的时候,可能要从多个表中获 ...