Vue(一):安装Vue

今天看了看Vue…谁说简单上手的,难道是我太蠢了么(滑稽)。

安装Vue

1.首先要安装node.js,直接从node官网下载就可以了,一路next就行。

安装好之后可以在doc命令行输入node -v,如果出现版本信息说明安装成功。

2.接下来我们可以安装一下淘宝镜像,它能帮助我们快快的下一些依赖。

在命令行中输入npm install -g cnpm --registry= https://registry.npm.taobao.org

安装完后可以使用cnpm -v查看是否安装成功。

3.安装webpack,在命令行输入npm install webpack -g,完成之后可以通过webpack -v查看是否安装成功。

4.安装vue脚手架,在命令行输入npm install vue-cli -g,完成之后输入vue -V检查,注意-V是大写哦。

使用脚手架创建自己的项目

完了再说吧。

遇到的坑

目前还没有使用脚手架创建一个自己的项目,毕竟拿来主义(/滑稽)。

自己完整的写前端真的蛋疼,所以从GitHub上找到了一个后台的模版拿来用用。

然而即便这样。。。还是出现了一些问题。

问题一

进入项目后执行npm install命令时,先是出现了这样一个问题(忘了截图了):

gyp ERR! stack Error: Can’t find Python executable “python”, you can set the PYT HON env variable.

发现是没有安装python,然后去网上找了两条命令来解决这个问题。

第一条:npm install --global --production windows-build-tools

这个命令会在你的用户目录下创建一个windows-build-tools文件夹。

在这遇到了第一个坑,当时执行这个命令卡在一个地方很久,可能是因为文件太大的过。我以为它下载玩了,然后我把它给关掉了。。。然后导致后面出现了问题,一直提示我没有安装python,所以一定要看到下面的样子才是真的下完了。(其实不是坑,是自己手贱)

第二条:npm install --global node-gyp

在运行完上面的命令后,去环境变量里设置一下python的环境变量。

添加一个PYTHON的环境变量,值为python.exe的路径 ,需要在结尾带上/python.exe。

问题二

在解决了上面的那个问题后,打算启动一下这个项目

输入npm run dev 之后,霹雳哐啷报了一堆错,内心是崩溃的。

查看报错信息发现有这样一条

This usually happens because your environment has changed since running npm install. Run npm rebuild node-sass to build the binding for your current environment.

上网查了之后说是node版本不一致巴拉巴拉的,然后给了两个命令,大部分博客内容如下:

此时运行按照提示执行 npm rebuild node-sass 命令,(如若不行,则先运行npm install node-sass命令执行)

然后再运行 node命令,启动服务。

然后我就跟着做了,但是在当前目录下运行npm install node-sass时也会出错,总会提示有一个文件损坏无法读取,进入到项目的nodel_modules也没有看到这个node-sass文件夹(花Q)。

然后这两条命令换着执行折腾了好久,依旧没什么用。

冷静分析之后,既然是要安装一个node-sass,不然换种方式安装,然后我用了这个命令:

cnpm install --save-dev node-sass

结果,就好了。

然后询问同事有没有遇到这个情况后,他说当时用cnpm下不下来,必须用npm。