怎么在 vue-cli webpack环境中 使用sass

Question

问题

我在用Vue-cli 脚手架开发中，想使用compass作为css预编译器，
于是我做了如下操作：
npm install sass --save-dev
先安装compass的预编译器
然后在.vue文件中设置了 <style>设置了 lang属性 <style lang="sass">
但是在编译器中报了错误

Currently the sass-loader does not follow all of the webpack loader guidelines. The general problem is that the entry scss-file is passed to node-sass which does pretty much the rest. Thus @import statements inside your scss-files cannot be resolved by webpack's resolver. However, there is an issue for that missing feature in libsass.

找了Vue的官方文档， 和Vue-lic的 readme 还有issue 都没有找到怎么切换css预编译语言的配置方案 ，故在此寻求我步骤中的错误，以及解决方案

Answer 1

• 这个问题的答案，都是零零碎碎的，没有一个玩玩整整的解决方案。
• 所以最后我选择放弃了我使用已久的scss，现在使用的css预编译器是stylus ，在 Vue-cli 和gulp中间都在使用。
• 不过语法上可能有些让人不太适应，就像 ejs模板和jade模板一样的！不过胜在安装方便
• 工具旨在提高生产效率，所以我选择了，安装配置简单的stylus。

如果使用scss的话，我后面了解的不完全资料，可能需要依赖 sass-lib node-sass 还需要 python、c++编译环境。不展开说了，这点留给专业的人士来说吧

---

来自时隔数年后的回答，让这个问题更有存在的意义吧

实际上在我们电脑没有安装 c++ 编译环境的时候，使用 sass 就有可能出现这个问题，为什么说是可能呢，因为现在已经有多重sass 编译器供我们选择了。
提问的时候，使用的是 node-sass 这是libsass 这个c++ 包的node版本，故而我们使用的时候一般是从 github 上下载 node-sass 这个包的源码，在本地通过 node-gyp 来编译。这就要求我们电脑上需要有 c++ 编译环境和 python 2.7 了。

所以这个问题实际的解决方案分文两种了：

1. 绕过编译，直接使用 cnpm 安装，没错现在cnpm 会直接安装已经编译好的.node 文件，而不是通过源码安装
2. 准备好 C++ 包的编译环境，总有一些项目没办法通过cnpm 安装依赖然后还能完美的跑起来，这时候需要我们在电脑上准备好 c++ 编译环境，以及 python 2.7 了。

针对解决方案2 ，我一般的做法是安装nodejs ，或者切换一个新安装的nodejs版本后，执行如下两个命令

npm i node-gyp -g
npm i windows-build-tools -g

来全局安装 node-gyp、vc++ 编译环境以及 python2.7 当然我这是 windows 的做法，其他的自行所搜吧，有很多解决方案

Answer 2

<style lang="sass">或者<style lang="scss">