Do not use ‘new‘ for side effects【解决方法】

今天爱分享给大家带来Do not use ‘new‘ for side effects【解决方法】,希望能够帮助到大家。
情景再现
我使用了以下命令运行 Vue 项目之后:


npm start
#或者
npm run dev

eslint 会报 Do not use ‘new’ for side effects 这个 warning,完整 warning 信息如下:


14% building modules 39/40 modules 1 active ...er@0.28.11@css-loader\lib\css-ba 95% emitting WARNING  Compiled with 1 warnings上午6:27:53


  ✘  http://eslint.org/docs/rules/no-new                   Do not use 'new' for side effects
  src\main.js:7:1
  new Vue({
   ^

  ✘  http://eslint.org/docs/rules/no-multiple-empty-lines  Too many blank lines at the end of file. Max of 0 allowed
  src\main.js:11:1

   ^


✘ 2 problems (2 errors, 0 warnings)


Errors:
  1  http://eslint.org/docs/rules/no-new
  1  http://eslint.org/docs/rules/no-multiple-empty-lines

You may use special comments to disable some warnings.
Use // eslint-disable-next-line to ignore the next line.
Use /* eslint-disable */ to ignore all warnings in a file.


虽然不影响项目的运行,但是能解决的话还是解决一下比较好。

我写的 main.js 代码如下:


import Vue from 'vue'
import App from './App.vue'

new Vue({
  el: '#app',
  render: h => h(App)
})

解决方法
方法一
定义一个变量 xxx (可为任意值)接收新创建的 Vue


let xxx = new Vue({
    el: '#app',
    render: h => h(App),
    router
})
Vue.use({
    xxx
})

改好后的 main.js 代码如下:


import Vue from 'vue'
import App from './App.vue'

let vue = new Vue({
  el: '#app',
  render: h => h(App)
})

Vue.use({
  vue
})


注意:文件的末尾需要有空的一行,否则 eslint 会提示 Newline required at end of file but not found

方法二
在 new Vue 的上方添加一行注释,让 eslint 忽略文件中所有的 warnings


/* eslint-disable */

改好后的 main.js 代码如下:


import Vue from 'vue'
import App from './App.vue'

/* eslint-disable */
new Vue({
  el: '#app',
  render: h => h(App)
})


方法三
在 new Vue 的上方添加一行注释,让 eslint 忽略文件中所有的 “no-new”


/* eslint-disable no-new */

改好后的 main.js 代码如下:


import Vue from 'vue'
import App from './App.vue'

/* eslint-disable no-new */
new Vue({
  el: '#app',
  render: h => h(App)
})


方法四
在 new Vue 的当前行添加一行注释,让 eslint 忽略文件中当前行的 warnings


some code // eslint-disable-line

改好后的 main.js 代码如下:


import Vue from 'vue'
import App from './App.vue'

new Vue({ // eslint-disable-line
  el: '#app',
  render: h => h(App)
})


方法五
在 new Vue 的当前行的上一行添加一行注释,让 eslint 忽略文件中下一行的 warnings


// eslint-disable-next-line
some code

改好后的 main.js 代码如下:


import Vue from 'vue'
import App from './App.vue'

// eslint-disable-next-line
new Vue({ 
  el: '#app',
  render: h => h(App)
})


解决问题后的运行结果


$ npm start

> xxx@1.0.0 start
> npm run dev


> xxx@1.0.0 dev
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js

 10% building modules 0/1 modules 1 active ... webpack/hot/dev-server ./src/main
 ...
 95% emitting DONE  Compiled successfully in 9715ms上午6:53:04

 I  Your application is running here: http://localhost:8080


人已赞赏
前端

Error: Cannot find module 'array-includes'【解决方法】

2020-12-30 22:00:38

前端

Module build failed:TypeError:loadContext.getResolve is nota function【解决方法】

2020-12-30 22:07:53