我正在尝试使用 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 文件中的另一个问题对我来说仍然是个谜。