sass-loader Не удается разрешить URL-адрес @import - PullRequest
Новая
       17

sass-loader Не удается разрешить URL-адрес @import

0 голосов
/ 01 июня 2019

Я использую nuxt.js с fastify.js (fastify-vue-plugin) и настраиваю свой стиль.

Scss компилируется и работает, но выдает ошибку при сборке, когда я пытаюсьимпортировать шрифт из googlefonts следующим образом: 

// _variables.scss
@import url('https://fonts.googleapis.com/css?family=Crimson+Text&display=swap');
@import url('https://fonts.googleapis.com/css?family=Montserrat&display=swap');

// styles.scss
@import 'variables'; // i've tested this import, it works flawlessly.

Я получаю сообщение об ошибке npm run dev: 

ERROR  Failed to compile with 1 errors                                                                           friendly-errors 04:00:16


 ERROR  in ./assets/scss/styles.scss                                                                              friendly-errors 04:00:16

Module build failed (from ./node_modules/postcss-loader/src/index.js):                                            friendly-errors 04:00:16
Error: Can't resolve 'https:/fonts.googleapis.com/css?family=Crimson+Text&display=swap' in '/Users/home/Projects/voxicard-app/assets/scss'
    at onError (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/lib/Resolver.js:61:15)
    at loggingCallbackWrapper (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
    at runAfter (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/lib/Resolver.js:158:4)
    at innerCallback (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/lib/Resolver.js:146:3)
    at loggingCallbackWrapper (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
    at next (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/node_modules/tapable/lib/Tapable.js:252:11)
    at innerCallback (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/lib/Resolver.js:144:11)
    at loggingCallbackWrapper (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
    at next (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/node_modules/tapable/lib/Tapable.js:249:35)
    at resolver.doResolve.createInnerCallback (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:44:6)
    at loggingCallbackWrapper (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
    at afterInnerCallback (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/lib/Resolver.js:166:11)
    at loggingCallbackWrapper (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
    at next (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/node_modules/tapable/lib/Tapable.js:249:35)
    at /Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/lib/ModuleKindPlugin.js:23:4
    at loggingCallbackWrapper (/Users/home/Projects/voxicard-app/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
                                                                                                                  friendly-errors 04:00:16
 @ ./assets/scss/styles.scss 4:14-301 14:3-18:5 15:22-309
 @ ./.nuxt/App.js
 @ ./.nuxt/index.js
 @ ./.nuxt/client.js
 @ multi eventsource-polyfill webpack-hot-middleware/client?reload=true&timeout=30000&ansiColors=&overlayStyles=&name=client&path=/__webpack_hmr/client ./.nuxt/client.js

// nuxt.config.js
...
css: [
    './assets/scss/styles.scss'
  ],

  /*
  ** Plugins to load before mounting the App
  */
  plugins: [
  ],

  /*
  ** Nuxt.js modules
  */
  modules: [
    // Doc: https://bootstrap-vue.js.org/docs/
    'bootstrap-vue/nuxt',
    '@nuxtjs/style-resources'
  ],
  bootstrapVue: {
    bootstrapCSS: false,
    bootstrapVueCSS: false
  },
  styleResources:{
    scss:[
        './assets/scss/*.scss',
    ]
  },
...

У меня есть другой проектгде я использовал sass-загрузчик с тем же импортом шрифтов, и это работало, хотя это не был проект Nuxtjs.

Что здесь не работает?

1 Ответ

0 голосов
/ 01 июня 2019

Из комментария Альдарунда мне удалось исправить эту ошибку, удалив эту строку из моего nuxt.config.js

// nuxt.config.js
styleResources : {
    scss: [
        './assets/scss/*.scss' // <<<< I Removed this line and kept this array empty.
    ]
}
...