1

我正在尝试使用 vue-cli 3.x、typescript、pug 和 .sass 文件设置一个 Vue 项目。

我还想全局导入几个文件,以便它们在我的所有组件中都可用(我遵循了本指南

main.ts

import Vue from 'vue'
import App from './App.vue'
import router from '@/router'
import store from '@/store'
import './registerServiceWorker'
import '@/sass/main.sass'

main.sass

@import partials/variables
@import ../../node_modules/globl.css/main

vue.config.js

module.exports = {
    css: {
        loaderOptions: {
            sass: {
                data: `
                    @import "@/sass/partials/_variables.sass";
                    @import "./node_modules/globl.css/partials/_mixins.sass";
                `
            }
        }
    }
}

导航栏组件给我错误

<template lang="pug">
.navbar Navbar
</template>

<script lang="ts">
import Vue from 'vue'
export default Vue.extend({})
</script>

<style lang="sass">
.navbar 
    color: red
</style>

错误日志

在此处输入图像描述

我注意到,如果我从组件中删除 sass 并将其转换为 scss,错误就会消失......

main.sass 文件中的另一个问题对我来说仍然是个谜。

4

0 回答 0