Vue2+Vue Cli项目安装及配置Sass流程




# 安装Vue Cli
npm install -g @vue/cli
 
# 创建一个新的Vue项目
vue create my-project
 
# 进入项目目录
cd my-project
 
# 安装sass依赖
npm install sass-loader sass --save-dev
 
# 配置Vue项目以使用Sass
# 在Vue组件中使用Sass，只需在<style>标签中指定lang="scss"

在Vue组件中使用Sass：




<template>
  <div class="example">Hello, Vue with Sass!</div>
</template>
 
<script>
export default {
  name: 'ExampleComponent'
}
</script>
 
<style lang="scss">
.example {
  color: blue;
  font-size: 20px;
  &:hover {
    color: red;
  }
}
</style>

以上代码展示了如何在Vue2项目中安装并使用sass-loader来在Vue组件中编写Sass代码。这是一个基本的流程，具体项目中可能需要更复杂的配置，例如在vue.config.js中配置loader选项。

Vue2+Vue Cli项目安装及配置Sass流程

评论已关闭

推荐阅读