Ubuntu18.04下vue环境搭建+VSCode

小咪咪 2022-05-24 12:05 511阅读 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 条评论，511人围观）

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

相关阅读

相关 ubuntu下搭建vue

1.安装node sudo apt-get install nodejs sudo apt install nodejs-legacy 2.

我不是女神ヾ/ 2023年10月11日 14:57/ 0 赞/ 31 阅读

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

参考文献 [vue+vscode+nodejs 开发环境搭建 - Desperador - 博客园][vue_vscode_nodejs _ - Desperador -]

迷南。/ 2023年10月02日 14:54/ 0 赞/ 36 阅读

相关使用VsCode搭建Vue开发环境

搭建Vue开发环境有两种安装方式 1 使用script标签、直接下载并用script标签引入，Vue 会被注册为一个全局变量。这里又分两个版本我们开发就

骑猪看日落/ 2023年09月27日 09:42/ 0 赞/ 37 阅读

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

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

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

相关Ｕbuntu下golang环境搭建

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

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

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

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

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

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

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

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

相关 Vue环境搭建+VSCode+Win10

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

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

相关 ubuntu下 Gitlab环境搭建

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

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

相关 VSCode搭建VUE 开发环境

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

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