Ubuntu18.04下vue环境搭建+VSCode

小咪咪 2022-05-24 12:05 495阅读 0赞

***1.安装npm（类似.net中的nuget包管理器）***

sudo apt-get install npm

输入npm-v可查看到版本号

***2.安装cnpm（淘宝的npm）***

sudo npminstall -g cnpm --registry=[https://registry.npm.taobao.org][https_registry.npm.taobao.org]

输入cnpm-v可查看到版本号，输入node-v可看到node的版本号

输入node回车，再输入console.log(“hello”);注意以英文分号结束，查看到输出结果就说明安装成功了。

![70][]

然后输入  .exit退出node程序回到命令行。

**3.安装vue-cli（用来生成vue模版的工具）**

sudo cnpm install -g vue-cli

**4.建一个Vue项目**

在新建过程中会要输入几次回车和y或n，（记得最后一步选择NoI will handle that myselft，也就是创建完项目后由我自己来下载依赖）

完成后在 /home目录下可看到test1

输入cd test1进入目录

输入sudo cnpminstall下载安装项目的依赖

输入sudo cnpm run dev后会给出提示让我们在浏览器通过http://localhost:8080地址访问

**5.安装VSCode**

最简单的方式就是打开ubuntu软件，搜索VSCode，然后安装。

![70 1][]

另一种方式是进入官网下载https://code.visualstudio.com/Download下载.deb后缀的安装包，然后双击安装。这种比上面的要下载快多了，一下就下完了。

A.安装vetur插件，是vue语法的高亮插件。

B.安装eslint插件，是智能错误检测插件。

这两年插件安装，先要打开：查看\-〉扩展，在搜索框中输入vetur，找到后安装。eslint同理。

然打点击打开文件夹，打开test项目

![70 2][]

然后打开终端选项卡

输入sudo cnpm install检查和下载依赖

输入密码（如果需要）

输入sudo cnpm run dev运行vue程序

最后得到运行地址。

![70 3][]

[https_registry.npm.taobao.org]: https://registry.npm.taobao.org/
[70]: /images/20220524/731de7693d384ccdafa6674d0ef2d328.png
[70 1]: /images/20220524/d12ca867306749e48dfa442bfc0dd91b.png
[70 2]: /images/20220524/0175b4efbe0d4bde9b82bc0932623824.png
[70 3]: /images/20220524/b20cd3d6dd9a407190be144d56d73552.png

发表评论取消回复

表情：

评论列表（有 0 条评论，495人围观）

还没有评论，来说两句吧...

相关阅读

相关 vscode 开发vue必备插件_vsCode搭建Vue开发环境

1.安装node.js 直接官网首页下载安装：http://nodejs.cn/download/，根据默认选项，一路下一步即可运行 node -v 和 npm -v ，

川长思鸟来/ 2023年01月03日 01:37/ 0 赞/ 251 阅读

相关 vue+vscode+nodejs 开发环境搭建

nodejs安装配置 1.下载地址：[https://nodejs.org/en/][https_nodejs.org_en] 2.默认安装 ![2964f01ce

野性酷女/ 2022年10月26日 14:10/ 0 赞/ 274 阅读

相关Ｕbuntu下golang环境搭建

一、安装必备环境 sudo apt-get install git golang-go vim sublime-text-installer 如果出现安装错误，进行修

桃扇骨/ 2022年07月03日 21:29/ 0 赞/ 377 阅读

相关 ubuntu下vue.js环境搭建初始化项目

1、安装npm sudo apt-get install npm 2、安装cnpm sudo npm install cnpm -g 3、安装脚手架，搭

比眉伴天荒/ 2022年06月10日 07:40/ 0 赞/ 181 阅读

相关 Ubuntu18.04下vue环境搭建+VSCode

1.安装npm（类似.net中的nuget包管理器） sudo apt-get install npm 输入npm-v可查看到版本号 2.安装cnpm（淘宝的n

小咪咪/ 2022年05月24日 12:05/ 0 赞/ 496 阅读

相关 Vue环境搭建+VSCode+Win10

一、安装Node.js（js的运行环境） 1.在Node.js官网https://nodejs.org/en/download/下载安装包。 2.下载后进行安装。

你的名字/ 2022年05月24日 03:35/ 0 赞/ 344 阅读

相关 ubuntu下 Gitlab环境搭建

Gitlab环境搭建 1. 服务环境操作系统 : Ubuntu 14 安装Gitlab 官网：[https://about.gitlab.com/][htt

港控/mmm°/ 2022年05月20日 02:39/ 0 赞/ 410 阅读

相关 vue + vscode 搭建

node.js , npm , vue2.0 , less , axios , webpack 参考： [https://blog.csdn.net/mao83409

曾经终败给现在/ 2022年04月12日 04:37/ 0 赞/ 329 阅读

相关 VSCode搭建VUE 开发环境

一，下载Node.js,去官网[https://nodejs.org/en/download/][https_nodejs.org_en_download]下载选择Wind

一时失言乱红尘/ 2022年03月28日 02:13/ 0 赞/ 460 阅读

相关 flutter vscode环境搭建

前面使用android搭建了flutter的开发环境，众所周知的是android运行需要很大的内存空间，如果在把模拟器跑起来，那速度就够我们头疼了。。。当然了电脑配置好的就不需

￡神魔★判官ぃ/ 2021年12月10日 09:13/ 0 赞/ 387 阅读