如何在vue項目中使用styl

由於新開的項目，想使用下styl，但是出師不利，創建項目時候就各種bug各種報錯，所以先記錄下來

首先，我們需要在style里面加入這樣一句

<style lang='stylus' rel="stylesheet/stylus">

如果不加的話是會報錯的

然后在main.js中引入

import './style/stylus/index.styl'

當然，這樣是不會出來的，我們還需要安裝style-loader和stylus-loader

npm install stylus stylus-loader style-loader --save-dev

然后修改webpack配置項（webpack.base.conf.js）在extensions中添加styl

  resolve: {
    extensions: ['.js', '.vue', '.json','.styl'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src'),
    }
  },

最后修改rules

 {
        test: /\.styl$/,
        loader: 'style-loader!css-loader!stylus-loader',
        include: []
      }

嗯 就這樣就可以了