1.在src-common-的styles中寫入的mixin.styl檔案，

border-1px($color)
  position: relative
&:after
display: block
position: absolute
left: 0
bottom: 0
width: 100%
    border-top: 1px solid $color

2.在App.vue中的<style></style>引入上面寫的檔案，

@import './common/styles/mixin.styl';

3.執行檔案的時候，報以下錯誤

This dependency was not found:

（重新安裝一次stylus：npm install stylus-loader css-loader style-loader --save-dev）

4.安裝好以後，再執行一次專案，還是報錯：

./~/[email protected]?{"minimize":false,"sourceMap":false}!./~/[email protected]/lib/style-compiler?{"vue":true,"id":"data-v-13330d4d","scoped":false,"hasInlineConfig":false}!./~/[email protected]/dist/cjs.js?{"sourceMap":false}!./~/[email protected]/lib/selector.js?type=styles&index=0!./src/App.vue
Module build failed: 


// load the styles
var content = require("!!../../../node_modules/[email protected]/index.js??ref--12-1!../../../node_modules/[email protected]/index.js??ref--12-2!./mixin.styl");
          ^
Unrecognised input
      in E:\imoc\src\common\styles\mixin.styl (line 4, column 12)
 @ ./~/[email protected]!./~/[email protected]?{"minimize":false,"sourceMap":false}!./~/[email protected]/lib/style-compiler?{"vue":true,"id":"data-v-13330d4d","scoped":false,"hasInlineConfig":false}!./~/[email protected]/dist/cjs.js?{"sourceMap":false}!./~/[email protected]/lib/selector.js?type=styles&index=0!./src/App.vue 4:14-409 13:3-17:5 14:22-417
 @ ./src/App.vue
 @ ./src/main.js
 @ multi ./build/dev-client ./src/main.js

（解決方法：把<style>標籤中的 lang='less'，修改成 lang='stylus'，並且去掉樣式的所有分號和大括號，如下：）

<style  lang="stylus">
@import './common/styles/mixin.styl';
#app
.tab
display: flex
width:100%
      height:80px
line-height: 80px
/*border-1px(rgba(7,17,27,0.1))*/
.tab-item
flex-grow:1
text-align: center
font-size:28px
color: #4d555d
line-height:28px
border-bottom:2px solid rgba(7,17,27,0.1)
      .active
color: #f01414
</style>