[英]Import scss variables into typescript in Vue
我正在尝试将 SASS (scss) 变量导入 typescript Vue 3 项目中的 javascript:
// @/assets/styles/colors.scss
$white: #fff;
// @/assets/styles/_exports.scss
@import "./colors.scss";
:export {
white: $white;
}
<template>
<div>
</div>
</template>
<script lang="ts">
import colors from "@/assets/styles/_export.scss";
</script>
// vue.config.js
module.exports = {
css: {
loaderOptions: {
sass: {
prependData: '@import "@/assets/styles/colors.scss";'
}
}
}
};
但我得到了Cannot find module '@/assets/styles/_export.scss' or its corresponding type declarations.
.
有什么想法吗?
谢谢
我在src
目录中创建了一个名为shims-scss.d.ts
的声明文件。
// shims-scss.d.ts
declare module '*.scss' {
const content: {[className: string]: string};
export default content;
}
它的工作对我来说,从导入对象scss
文件等作为_exports.scss
你写。
在 scss 中导入部分类时,不要包含下划线。 尝试这个:
import colors from "@/assets/styles/export.scss";
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.