[1003] Loading file based css

Hi there :) I'm trying to load a simple css file as stated in the docs. But I fail to do so. The name of css file is stored in assets/App.scss. And the css section my nuxt.config.js is like below:

  css: [
      'bootstrap-material-design/dist/css/bootstrap-material-design.css',
      'bootstrap-material-design/dist/css/ripples.css',
      {src: '~assets/App.scss', lang: 'scss'}
  ]

But this gives me following error:

This dependency was not found:

* ~assets/App.scss in ./~/babel-loader/lib?{"presets":["vue-app"],"babelrc":false,"cacheDirectory":true}!./~/vue-loader/lib/selector.js?type=script&index=0!./.nuxt/App.vue

To install it, you can run: npm install --save ~assets/App.scss

I have read the docs many times I can't find where I'm doing wrong.