Skip to content

.vue file <style> scss can not loadΒ #2199

Closed

Description

@rambo-panda

❔ Question

I don't know how to describe my problem. I hope you can patiently check the code below.

πŸ’» Code Sample

files

 start.sh
package.json
parcel/
└── sample
    β”œβ”€β”€ deps
    β”‚Β Β  └── function.scss
    β”œβ”€β”€ index.html
    └── src
        β”œβ”€β”€ app.js
        └── components
            β”œβ”€β”€ a.sh
            β”œβ”€β”€ a.vue
            β”œβ”€β”€ b.vue
            β”œβ”€β”€ c.vue
            β”œβ”€β”€ d.vue
            β”œβ”€β”€ e.vue
            β”œβ”€β”€ f.vue
            β”œβ”€β”€ g.vue
            β”œβ”€β”€ h.vue
            β”œβ”€β”€ i.vue
            β”œβ”€β”€ j.vue
            └── k.vue

index.html

<script src="./src/app.js"></script>

parce/src/app.js

const a = () => import("./components/a.vue");
const b = () => import("./components/b.vue");
const c = () => import("./components/c.vue");
const d = () => import("./components/d.vue");
const e = () => import("./components/e.vue");
const f = () => import("./components/f.vue");
const g = () => import("./components/g.vue");
const h = () => import("./components/h.vue");
const i = () => import("./components/i.vue");
const j = () => import("./components/j.vue");
const k = () => import("./components/k.vue");

parcel/src/components/*.vue

<template><div>test</div></template><style lang="scss" scoped>@import "../../deps/function.scss";.a{width:vw(10);}</style>

parcel/deps/function.scss

@function vw($px) {
  @return ($px / 750) * 100vw;
}

start.sh

#!/bin/bash

rm -rf .cache ./dist

npx parcel ./parcel/sample/index.html --log-level 4

recurring step

image

change the app.js !! normal work

const a = () => import("./components/a.vue");
const b = () => import("./components/b.vue");
const c = () => import("./components/c.vue");

image

🌍 Environment

Software Version(s)
@vue/component-compiler-utils 2.2.0
node-sass 4.9.4
parcel-bundler 1.10.3
vue 2.5.17
vue-hot-reload-api 2.3.0
vue-router 3.0.1
vue-template-compiler 2.5.17
vuex 3.0.1
Node 8.12.0
npm/Yarn npm/6.4.1
Operating System mac 10.13.6 or window10 64bit

Activity

  1. rambo-panda commented on Oct 25, 2018

    @rambo-panda
    Author

    When I was debug, I found there was no callback here. So parcel has been waiting for the end.

  2. rambo-panda commented on Oct 25, 2018

    @rambo-panda
    Author

    What makes me very unbelievable is why stop here

    Is there a concurrency issue with the nodejs fs module?

  3. tangjingjing commented on Oct 26, 2018

    @tangjingjing

    I have the same problem in the nodejs v10

  4. rambo-panda commented on Oct 26, 2018

    @rambo-panda
    Author

    use dtruss

    image
    await ???

  5. JJChu commented on Oct 26, 2018

    @JJChu

    I have the same problem in the nodejs v10

  6. JJChu commented on Oct 27, 2018

    @JJChu

    @DeMoorJasper Hello, when will you fix it?

  7. DeMoorJasper commented on Oct 27, 2018

    @DeMoorJasper
    Member

    @JJChu I probably won't take on this issue anytime soon.
    I'm currently pretty busy with other things and within the parcel project my main focus is currently helping out with Parcel 2 as that's a bit too complex for new contributors.

    If anyone wants to take on this issue feel free to do so.

  8. rambo-panda commented on Nov 16, 2018

    @rambo-panda
    Author

    When I accidentally tried dart-sass, the problem was fine.

    #1509

  9. rambo-panda commented on Nov 16, 2018

    @rambo-panda
    Author

    The question of node-sass, I suspect is the conflict between await and NAPI.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions