You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Add @use 'path/to/my/file' to a <style lang="scss"></style> block, can be scoped too. If the name of the file is not exactly file.scss, but _file.scss, file/index.scss or file/_index.scss it doesn't find the file when Ctrl+Click-ing on the path.
What is expected?
When following link on @use 'path/to/my/file' or @import 'path/to/my/file', it should open one of path/to/my/file.scss, path/to/my/_file.scsspath/to/my/file/index.scss and `path/to/my/file/_index.scss.
Vue - Official extension or vue-tsc version
3.2.7
VSCode version
1.117.0
Vue version
3.5.33
TypeScript version
6.0.3
System Info
System: OS: Linux 6.1 Debian GNU/Linux 12 (bookworm) 12 (bookworm) CPU: (20) x64 13th Gen Intel(R) Core(TM) i5-13500 Memory: 13.38 GB / 31.03 GB Container: Yes Shell: 5.2.15 - /bin/bash Binaries: Node: 22.22.2 - /usr/bin/node Yarn: 1.22.22 - /usr/bin/yarn npm: 10.9.7 - /usr/bin/npm Browsers: Chrome: 147.0.7727.116 Firefox: 140.10.0esr Firefox Developer Edition: 140.10.0esrpackage.json dependencies
{ "dependencies": { "@alenaksu/json-viewer": "2.1.2", "@algolia/autocomplete-js": "^1.19.6", "@algolia/autocomplete-plugin-recent-searches": "^1.19.6", "@algolia/autocomplete-theme-classic": "^1.19.6", "@algolia/client-search": "^5.49.1", "@fullcalendar/core": "^6.1.20", "@fullcalendar/daygrid": "^6.1.20", "@meilisearch/autocomplete-client": "^0.7.0", "@microsoft/office-js": "^1.1.110", "@microsoft/teams-js": "^1.6.0", "@mozaweb/mwicon": "^0.98.99", "@sentry/browser": "^10.48.0", "@vueuse/core": "^14.2.1", "@vueuse/integrations": "^14.2.1", "algoliasearch": "^5.49.1", "altcha": "^3.0.4", "autosize": "^6.0.1", "bootstrap-rtl": "^3.3.4", "bootstrap-select": "^1.13.18", "bootstrap-social": "^5.1.1", "bootstrap3-dialog": "^1.35.4", "chart.js": "^4.5.1", "chartjs-plugin-zoom": "^2.2.0", "codemirror": "^5.53.2", "compare-versions": "^6.1.1", "construct-style-sheets-polyfill": "^3.1.0", "diff-match-patch": "^1.0.5", "dotenv": "^17.4.2", "envify": "^4.1.0", "eonasdan-bootstrap-datetimepicker": "^4.17.49", "globalthis": "^1.0.3", "handsontable": "16.2.0", "image-map-resizer": "^1.0.3", "jquery": "1.11.2", "jquery-bar-rating": "^1.2.2", "libphonenumber-js": "^1.12.41", "lodash-es": "^4.18.1", "mathjax": "4.1.1", "mblite": "*", "moment": "^2.30.1", "moment-timezone": "^0.6.1", "mqtt": "^5.15.1", "qrcode": "^1.5.4", "quill": "^2.0.2", "reka-ui": "^2.9.6", "search-insights": "^2.17.3", "select2": "4.0.2", "toastify-js": "^1.11.1", "ua-parser-js": "^2.0.9", "universal-cookie": "^8.1.0", "vue": "^3.5.33" }, "devDependencies": { "@dword-design/eslint-plugin-import-alias": "^8.1.8", "@eslint/js": "^10.0.1", "@sentry/vite-plugin": "^5.2.0", "@types/autosize": "^4.0.3", "@types/bootstrap.v3.datetimepicker": "^4.17.54", "@types/bootstrap3-dialog": "^1.35.5", "@types/chart.js": "^4.0.1", "@types/ckeditor4": "^4.20.7", "@types/dom-speech-recognition": "^0.0.9", "@types/jquery": "^4.0.0", "@types/jqueryui": "^1.12.24", "@types/lodash-es": "^4.17.12", "@types/picomatch": "^4.0.3", "@types/plupload": "2.0.14", "@types/rtlcss": "^3.5.4", "@vitejs/plugin-legacy": "^8.0.1", "@vitejs/plugin-vue": "^6.0.6", "browserify": "^17.0.1", "chartjs-plugin-datalabels": "^2.2.0", "esbuild": "^0.28.0", "eslint": "^10.2.1", "eslint-config-prettier": "^10.1.8", "eslint-import-resolver-typescript": "^4.4.4", "eslint-plugin-import-x": "^4.16.2", "eslint-plugin-vue": "^10.9.0", "globals": "^17.5.0", "gulp": "^5.0.0", "gulp-buffer": "^0.0.2", "gulp-concat": "^2.6.1", "gulp-if": "^3.0.0", "gulp-jsvalidate": "^6.1.0", "gulp-tap": "^2.0.0", "gulp-uglify": "^3.0.2", "laravel-vite-plugin": "^3.0.1", "picomatch": "^4.0.4", "postcss": "^8.5.10", "postcss-preset-env": "^11.2.1", "postcss-rtlcss": "^6.0.0", "prettier": "^3.8.3", "rtlcss": "^4.3.0", "sass": "^1.99.0", "terser": "^5.46.2", "through2": "^4.0.2", "typescript": "^6.0.3", "typescript-eslint": "^8.59.0", "vite": "^8.0.10", "vite-plugin-commonjs": "^0.10.4", "vite-plugin-pwa": "^1.2.0", "vite-plugin-restart": "^2.0.0", "vite-plugin-rtl-css": "^1.0.9", "vite-plugin-static-copy": "^4.1.0", "vite-plugin-vue-devtools": "^8.1.1", "vue-eslint-parser": "^10.4.0", "vue-tsc": "^3.2.7", "z-vue-scan": "^0.0.37" }, }Steps to reproduce
Add
@use 'path/to/my/file'to a<style lang="scss"></style>block, can be scoped too. If the name of the file is not exactlyfile.scss, but_file.scss,file/index.scssorfile/_index.scssit doesn't find the file whenCtrl+Click-ing on the path.What is expected?
When following link on
@use 'path/to/my/file'or@import 'path/to/my/file', it should open one ofpath/to/my/file.scss,path/to/my/_file.scsspath/to/my/file/index.scssand `path/to/my/file/_index.scss.https://sass-lang.com/documentation/at-rules/import/#partials
https://sass-lang.com/documentation/at-rules/import/#index-files
What is actually happening?
Right now
@use 'path/to/my/file'only findspath/to/my/file.scss, if it doesn't exist vscode says unable to open 'file.scss'Link to minimal reproduction
Reproduction
Any additional comments?
Also, this might be a separate issue but path aliases set up in Vite don't work either with @use and @import directives.