Freemon

vue项目build错误解决

Posted on In

  今天朋友给我一份vue的项目代码，说是看不懂，不知道如何运行去生成静态页面，好部署到服务器上。

Start

项目代码的目录结构是

1
2
3
4
5
6
7
8
├── README.md
├── babel.config.js
├── dist
├── package-lock.json
├── package.json
├── public
├── src
└── vue.config.js

一看就知道少了第三方模块文件夹node_modules，所以先进入目录，再安装所需模块，等等，先清一下缓存

1
2
$ npm cache clean --force
$ npm install

报错

安装好模块之后运行代码npm run build报错。再回头看看刚才install的警告:

1
2
npm WARN sass-loader@8.0.2 requires a peer of sass@^1.3.0 but none is installed. You must install peer dependencies yourself.
npm WARN sass-loader@8.0.2 requires a peer of fibers@>= 3.1.0 but none is installed. You must install peer dependencies yourself.

刚刚intalll的时候安装了node-sass@4.14.1，上面的node-loader里面要求安装对应的版本，那就安装吧

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$ npm install sass@^1.3.0
$ npm install fibers@>= 3.1.0 
//上面没有指定具体版本是会报错的： npm ERR! 404 Not Found: 3.1.0@latest

//查看fibers现在是什么版本了
$ npm view fibers version
5.0.0

//那就直接安装最新的
$ npm install fibers 

//报错了，也看得出这是build的关键模块吧
//> node build.js || nodejs build.js
//gyp: No Xcode or CLT version detected!
//node-gyp exited with code: 1

解决问题

一大堆报错让人心烦，并且害怕。难道又要安装什么node-gyp或者Xcode等，可是这些都不想装啊，好麻烦。就阴差阳错地试着安装一个满足条件的版本

1
$ npm install fibers@3.1.0

结果就安装成功了…其实执行这一步的之前，因为心烦意乱地就开了全局模式了，不知道跟wall有没有关系，总之不行的话就魔法上网吧。

End

最后build一下就可以生成静态文件了，放在新生成的dist目录里面

1
$ npm run build

将dist文件夹传到服务器就可以看到项目的效果了！