资讯专栏INFORMATION COLUMN

工作中常见问题汇总及解决方案

ddongjian0000 / 1763人阅读

摘要:注本文是我在开发过程中遇到问题及解决方法的总结,之后会持续更新,希望帮助到更多的学习者。文中有不妥的地方希望指出共同学习,同时欢迎一起补充。

注:本文是我在开发过程中遇到问题及解决方法的总结,之后会持续更新,希望帮助到更多的学习者。文中有不妥的地方希望指出共同学习,同时欢迎一起补充。

npm篇 npm安装依赖报错:permission denied,错误信息大致如下:
npm ERR! Darwin 15.6.0                                                                                                                     
npm ERR! argv                                             
npm ERR! node                                                                                                                       
npm ERR! npm                                                                                                                      
npm ERR! path                                                                                           
npm ERR! code EACCES                                                                                                                       
npm ERR! errno -13                                                                                                                         
npm ERR! syscall mkdir                                                                                                                     
                                                                                                                                           
npm ERR! Error: EACCES: permission denied, mkdir              
npm ERR!     at Error (native)                                                                                                             
npm ERR!  { Error: EACCES: permission denied, mkdir         
npm ERR!     at Error (native)                                                                                                             
npm ERR!   errno: -13,    

关键错误信息:Error: EACCES: permission denied, 解决办法:

// win 管理员身份运行cmd再npm命令

// mac 全局要加sudo
sudo npm install ....
npm install 报错chromedriver 记录,错误信息如下:
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! chromedriver@2.34.1 install: `node install.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the chromedriver@2.34.1 install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

该问题是vue-cli脚手架的一个bug,解决办法:

npm install chromedriver --chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver
roadhog篇 roadhog 定义多于一个/分割符的路由匹配时报错,错误信息如下:
Unhandled Rejection (Error): Loading chunk 3 failed. HTMLScriptElement.onScriptComplete internal:/webpack/bootstrap df2d9286a38225b2cb63:756 This screen is visible only in development. It will not appear if the app crashes in production. Open your browser’s developer console to further inspect this error.

解决办法:在.webpackrc 或 .roadhogrc 添加 "publicPath": "/"。

roadhog 下 .webpackrc 或者 .webpackrc.js、.roadhogrc 或者 .roadhogrc.js 配置项出错,错误信息如下:
Build failed: Cannot read property "validate" of undefined
TypeError: Cannot read property "validate" of undefined
    at forEach.key (/Users/apple/jobs/reacts/react-antd-dva/node_modules/af-webpack/lib/getUserConfig/index.js:147:16)
    at Array.forEach ()
    at getUserConfig (/Users/apple/jobs/reacts/react-antd-dva/node_modules/af-webpack/lib/getUserConfig/index.js:131:30)
    at /Users/apple/jobs/reacts/react-antd-dva/node_modules/roadhog/lib/build.js:41:49
    at new Promise ()
    at new F (/Users/apple/jobs/reacts/react-antd-dva/node_modules/core-js/library/modules/_export.js:35:28)
    at _default (/Users/apple/jobs/reacts/react-antd-dva/node_modules/roadhog/lib/build.js:34:10)
    at Object. (/Users/apple/jobs/reacts/react-antd-dva/node_modules/roadhog/lib/scripts/build.js:9:20)
    at Module._compile (module.js:643:30)
    at Object.Module._extensions..js (module.js:654:10)
    at Module.load (module.js:556:32)
    at tryModuleLoad (module.js:499:12)
    at Function.Module._load (module.js:491:3)
    at Function.Module.runMain (module.js:684:10)
    at startup (bootstrap_node.js:187:16)
    at bootstrap_node.js:608:3
[graceful-process#10592] exit with code:0

解决办法:查看roadhog文档,确认配置项的正确性!尤其是从roadhog1.0升级到2.0很多配置项的变化!具体参考roadhog文档。

git篇 使用.gitkeep来追踪空的文件夹

解决办法:Git会忽略空的文件夹。如果你想版本控制包括空文件夹,根据惯例会在空文件夹下放置.gitkeep文件。其实对文件名没有特定的要求。一旦一个空文件夹下有文件后,这个文件夹就会在版本控制范围内。

当用git命令拉取最新代码时,有时会遇到如下的提示, Found a swap file by the name “.git/.MERGE_MSG.swp”

在项目根目录(如/StudioProjects/demo/Leave)下,找到.git/.MERGE_MSG.swp这个文件删除即可。 注:mac 删除命令rm -rf .MERGE_MSG.swp

eslint Do not use "new" for side effects

代码如下:

new Vue({
  el: "#app",
  router,
  template: "",
  components: { App }
})

报错:

原因:刪除了以下注释。这句注释可以绕过规则检测:

/* eslint-disable no-new */

在new Vue()上方加上句注釋即可:

/* eslint-disable no-new */
new Vue({
  el: "#app",
  router,
  template: "",
  components: { App }
})
vue-cli构建的项目,eslint一直报CRLF/LF的linebreak错误

如题,vue在构建项目的时候选择了airbnb规则,同时项目构建后被windows的unix bash工具pull并且push过,这之后在windows上进行开发,就开始一直报

Expected linebreaks to be "CRLF" but found "LF"

这样的错误,后经查是一种强制统一方式,并且解决方法是

linebreak-style: ["error", "windows"]

强制使用windows方式,我将之添加到了项目根目录下的 .eslintrc.js 文件中的rule字段下:

// add your custom rules here
  "rules": {
    // don"t require .vue extension when importing
    "import/extensions": ["error", "always", {
      "js": "never",
      "vue": "never"
    }],
    // allow optionalDependencies
    "import/no-extraneous-dependencies": ["error", {
      "optionalDependencies": ["test/unit/index.js"]
    }],
    // try to fix the line break problem
    "linebreak-style": ["error", "windows"],
    // allow debugger during development
    "no-debugger": process.env.NODE_ENV === "production" ? 2 : 0
  }

结果无效,现有问题二个:

1、是否是因为系统环境不同而造成了某种强制转换才会引发如上的错误?
2、如何选择性的关闭eslint某个功能(linebreak检查)?

问题1

不同的操作系统下,甚至是不同编辑器,不同工具处理过的文件可能都会导致换行符的改变。

问题2

项目根目录下有.eslintrc.js文件,在配置文件中修改rule配置项,如下:

```javascript
// 统一换行符,"
" unix(for LF) and "
" for windows(CRLF),默认unix
// off或0: 禁用规则
"linebreak-style": "off"
```
nuxt篇 错误信息:"TypeError: Nuxt is not a constructor" - when trying to use nuxt.js as a middleware

当我比着官方文档https://zh.nuxtjs.org/api/con...,发生了如下错误:

const nuxt = new Nuxt(config)
             ^
TypeError: Nuxt is not a constructor

解决办法:

const { Nuxt, Builder } = require("nuxt")

// Import and set nuxt.js options
let config = require("./nuxt.config.js")
config.dev = (process.env.NODE_ENV !== "production")

let nuxt = new Nuxt(config)

// Start build process (only in development)
if (config.dev) {
  new Builder(nuxt).build()
}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/90726.html

相关文章

  • Java面试 32个核心必考点完全解析

    摘要:如问到是否使用某框架,实际是是问该框架的使用场景,有什么特点,和同类可框架对比一系列的问题。这两个方向的区分点在于工作方向的侧重点不同。 [TOC] 这是一份来自哔哩哔哩的Java面试Java面试 32个核心必考点完全解析(完) 课程预习 1.1 课程内容分为三个模块 基础模块: 技术岗位与面试 计算机基础 JVM原理 多线程 设计模式 数据结构与算法 应用模块: 常用工具集 ...

    JiaXinYi 评论0 收藏0
  • CoordinatorLayout滑动抖动问题

    摘要:滑动抖动问题分析向上滚动无法被外部中断和子的联动时通过实现的,使用的继承了。当产生的向上的没有结束时,又送来向下的,抖动就产生了。反射获取私有的属性,考虑以后变量名修改的问题及一下版本可能是及以上版本然后在拦截事件里处理逻辑。 目录介绍 01.CoordinatorLayout滑动抖动问题描述 02.滑动抖动问题分析 03.自定义AppBarLayout.Behavior说明 04....

    atinosun 评论0 收藏0
  • tab.js分享浏览器兼容性问题汇总

    摘要:地址一直听说过浏览器的兼容性问题是深坑,这次终于有所体会,就本次优化而言,如果不对进行兼容,工作量可以减少一倍。特此把遇到的各种浏览器兼容性问题进行汇总,希望对大家有所帮助。以下为兼容方法以下为兼容写法不支持说明阻止事件的冒泡行为。 在 样式布局分享-基于frozen.js的移动OA 文章中,用了到第三方组件 tab.js(带菜单的横屏滑动插件),其兼容性很差,进行优化后,已兼容全平台...

    twohappy 评论0 收藏0
  • 前端基础汇总

    摘要:及相关问题数据类型函数中指向原型作用域闭包面向对象对象创建模式继承严格模式与对象转换的方法添加属性,根据原型创建区别新特性解构赋值简化对象写法剪头函数三点运算符模板字符串形参默认值异步过程深拷贝与浅拷贝赋值与浅拷贝的区别浅拷贝的几种方法实现 js及es相关问题 数据类型函数中this指向——————原型作用域闭包——————面向对象对象创建模式继承——————Es5严格模式Json与j...

    2json 评论0 收藏0
  • 前端基础汇总

    摘要:及相关问题数据类型函数中指向原型作用域闭包面向对象对象创建模式继承严格模式与对象转换的方法添加属性,根据原型创建区别新特性解构赋值简化对象写法剪头函数三点运算符模板字符串形参默认值异步过程深拷贝与浅拷贝赋值与浅拷贝的区别浅拷贝的几种方法实现 js及es相关问题 数据类型函数中this指向——————原型作用域闭包——————面向对象对象创建模式继承——————Es5严格模式Json与j...

    laznrbfe 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<