Vue中使用stylus报错,有可能是版本问题

如果按照正常的流程下载并且配置了stylus,但是依旧报错,那么下面就是解决方法：

一、正常配置stylus流程

1. 安装stylus、stylus-loader依赖(进入项目文件夹下)

   npm install stylus stylus-loader
   

    

2. package.json文件配置(手动添加依赖)

   "devDependencies": {
       ...
       "stylus": "^0.54.8",
       "stylus-loader": "^3.0.2",
   
       ...
         },
   

    

3. 在build >webpack.base.conf.js中配置存放styl文件夹别名

   resolve: {
       extensions: ['.js', '.vue', '.json'],
       alias: {
         'src': resolve('src'),
         '@': resolve('src')
      
       }
     },
   

    

4. 执行npm run serve启动，报错

查遍了网上所有的解答无非就是上面几个步骤？那问题到底出在哪里了呢？

注意还要查看下vue-loader的版本，太低的版本或太高，还会继续报错（比如Module build failed: TypeError: loader.charAt is not a function，就是版本低）可以通过npm install vue-loader@latest --save-dev 将vue-loader 更新到最新的版本

二、解决bug

1. 查看stylus和stylus-loader的版本，均为当前最新版本
   

2. 查了好多资料还是报错，因为我这里是版本太高了，总是报错，我卸载掉当前stylus和stylus-loader，重新安装了以前的版本，然后就好了
   

3. 重新npm run serve，成功启动