引入.stylus文件报错

Question

These dependencies were not found:

* common/stylus/index.styl in ./src/main.js

* !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-57e70d19","scoped":true,"hasInlineConfig":false}!stylus-loader?{"sourceMap":false}!../node_modules/vue-loader/lib/selector?type=styles&index=0!./App.vue in ./src/App.vue

To install them, you can run: npm install --save common/stylus/index.styl !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-57e70d19","scoped":true,"hasInlineConfig":false}!stylus-loader?{"sourceMap":false}!../node_modules/vue-loader/lib/selector?type=styles&index=0!./App.vue

> Listening at http://localhost:8080

Answer 1

qq_顺z嘫_1 2017-05-31 21:07:13

在build文件夹下的webpack.base.conf.js这个文件中找到resolve的配置
进行如下配置
resolve: {
 extensions: ['.js', '.vue', '.json'],
 alias: {
   'src': resolve('src'),
   'common':resolve('src/common'),
   'components':resolve('src/components')
 }
}
配置完成后重新启动服务输入命令npm run dev

• weixin_慕容6236415 #1

  标记一下，我个人感觉这个配置应该设定在build之外的什么地方，结合下边的回答解决了这个问题，估计版本更新太多导致了这个问题

Answer 2

MKleefat 2017-06-12 16:23:17

我也遇到了这个问题，但是不知道环境是不是和你的一样，我贴一下我的过程

背景如下：
npm目前升级到了5.0.3
npm install的时候目录会多一个package-lock.json这个文件
此时我在package.json的devDependencies中添加了
    "stylus": "^0.54.5",
    "stylus-loader": "^3.0.1"
然后在终端重新运行npm install的时候，项目中的node_modules并没有出现stylus文件夹
查了下资料说是新版本的坑
https://mp.weixin.qq.com/s?__biz=MjM5MDcyMzIwNQ==&mid=2447503211&idx=1&sn=ace8556f50d9e024ac961a35a81a6ed7&chksm=b25532818522bb9763fd079aec1aec45e5797174dde6f4a082eed21aed34504be3f69138600d&mpshare=1&scene=23&srcid=0608Z1eyFBufX2lMc9xU7JSj#rd
给的解决办法是切换回之前的npm版本……

我的解决过程
1、删除package-lock.json,重新npm install，node_modules中出现了stylus文件夹了，然而还是报错
2、在终端直接运行 sudo npm install stylus-loader stylus --save-dev 结果就编译成功了