Nuxt項目中scss的使用css
第一步,安裝依賴html
npm i node-sass sass-loader scss-loader --save-dev
第二步,建立scss文件vue
在asset文件夾下新建css文件夾,在css文件夾中新建index.scss文件,做爲scss樣式的總入口,而後在index.scss中經過@import引入其餘scss樣式文件node
@import 'variables'; @import 'mixins';
第三步,在配置中引入index.scss文件npm
在nuxt.config.js文件中的css中引入sass
css: [ { src: '~/assets/css/index.scss', lang: 'scss' } ]
ps:也能夠忽略二三步,直接在vue文件下的style中使用scss,以下flex
<style lang="scss"> .container { margin: 0 auto; min-height: 100vh; display: flex; justify-content: center; align-items: center; text-align: center; .links { padding-top: 15px; } } </style>
嗯,就醬~~~nuxt