1

背景

  • 导轨：5.1.4
  • 宝石：
    • 网络打包程序：3.0.1
  • 套餐：
    • @rails/webpacker：3.0.2
    • Vue：2.5.2
    • Vue加载器：13.3.0
    • vue 模板编译器：2.5.2
  • “对 JS 开发相当陌生；即 webpack”

问题

一切都已经工作了，但只是现在我尝试导入驻留在app/assets/stylesheets/imports/_variables.scss而不是当前文件的相对路径中的 scss 文件；在 Chrome 控制台中给我一个错误：

在此处输入图像描述

这是我尝试导入它的行：

应用程序/javascript/games/cards/Card.vue

<template>
...
</template>

<script>
...
</script>

<style lang='scss' scoped>
@import 'stylesheets/imports/variables';
...
</style>

我阅读了webpacker doc，因此我更新了我的config/webpacker.yml resolved_paths，重新启动了我的rails server但仍然失败。

配置/webpacker.yml

# Note: You must restart bin/webpack-dev-server for changes to take effect

default: &default
  source_path: app/javascript
  source_entry_path: packs
  public_output_path: packs
  cache_path: tmp/cache/webpacker

  # Additional paths webpack should lookup modules
  # ['app/assets', 'engine/foo/app/assets']
  resolved_paths: ['app/assets']

  # Reload manifest.json on all requests so we reload latest compiled packs
  cache_manifest: false

  extensions:
    - .coffee
    - .erb
    - .js
    - .jsx
    - .ts
    - .vue
    - .sass
    - .scss
    - .css
    - .png
    - .svg
    - .gif
    - .jpeg
    - .jpg

development:
  <<: *default
  compile: true

  dev_server:
    host: localhost
    port: 3035
    hmr: false
    https: false
...

PS我在没有运行的rails server情况下运行bin/webpack-dev-server，但运行时错误仍然存​​在bin/webpack-dev-server

我将不胜感激任何帮助或任何可能的调试过程。

4

0 回答 0