宝塔环境下配置PM2+NODE+VUE+WEBPACK环境

1.安装宝塔界面；

2.在宝塔界面“软件管理”或“软件商店”安装PM2；

3.检查是否安装成功和版本号，用SSH登陆服务器；输入：

a、node -v 命令：查看node的版本，若出现相应的版本号，则说明你安装成功了。
b、npm -v 命令：npm包管理器，是集成在node中的，所以安装了node也就有了npm,直接输入 npm -v 命令，显示npm的版本信息。

4.安装cnpm

在命令行中输入 npm install -g cnpm --registry=http://registry.npm.taobao.org ，然后等待，没报错表示安装成功。

5.安装webpack

在命令行中输入 cnpm install -g webpack

6.安装vue的脚手架工具

在命令行中输入 cnpm install -g vue-cli

输入：vue，回车，若出现vue信息说明表示成功。

7.创建项目（可以直接进入宝塔默认网站目录 cd /www/wwwroot/ 执行。）

在命令行中输入：vue init webpack vue_test(项目文件夹名)，回车，等待一小会儿，依次出现‘git’下的项。

注意事项：此时会不断要你输入些东西，注意到Eslint那个选项是选择
N（Eslint是语法规则和代码风格的检查工具，会自动检测当前项目的代码是否符合预设的规则，如果你的代码写得不符合预设的规则会报错），然后一直回车。

8.安装项目所需依赖，进入项目中：

cd vue_test

cnpm install

完成后，会发现项目目录下多出一个node_modules文件夹，里面就是 vue-cli 创建的一个基于 webpack 的 vue.js 项目。

9.上传项目文件到项目目录里。并修改config/index.js 访问的IP和端口号。

host: '127.0.0.1', // can be overwritten by process.env.HOST
port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
autoOpenBrowser: false,
errorOverlay: true,
notifyOnErrors: true,

10.运行项目

在命令行中输入 npm run dev

当显示：Your application is running here: http://127.0.0.1:8081 代表项目运行成功！

使用vue-cli初始化项目时运行‘npm run dev’报错

1、试一下卸载npm uninstall webpack-dev-server，在安装这个npm i webpack-dev-server@2.9.7，我的可以正常启动了。
2、删除node_modules目录，使用npm install，不要用cnpm，npm也是可以设置成淘宝镜像的，cnpm有时候用起来会有很多问题，无名无故的安装些多余的东西。

宝塔环境下配置PM2+NODE+VUE+WEBPACK环境相关推荐

VSCode环境下配置ESLint 对Vue单文件的检测
本文介绍了在VSCode环境下如何配置eslint进行代码检查,并介绍了如何对.vue单文件进行支持. ESLint 安装 1.在工程根目录下,安装eslint及初始化 $ npm install e ...
前端小白配置mac下node+vue开发环境的各种姿势
背景:笔者(前端小白)之前mac环境下用的node 9.8.x版本,npm 6.13.4版本,昨天尝试ts,用vue-cli构建项目对时候,vscode给提示说node版本太低了,好,笔者听从前辈经验 ...
vue在生产环境、测试环境和开发环境，三种环境下配置不同的api地址
vue在生产环境.测试环境和开发环境,三种环境下配置不同的api地址我们大多数在开发的时候,都会有三种环境,一个是开发环境,一个是测试环境,一个是生产环境,我们打包的时候需要根据不同的环境去加载不同 ...
RAC环境下配置TAF (Final)
TAF是Transparent Application Failover的英文缩写,顾名思义就是对应用透明的故障转移,举个例子,当应用连接某个oracle数据库的执行查询操作的时候,数据库服务器网络中 ...
kde5与archlinux环境下配置libinput-gestures多手势操作
初衷自己的笔记本是archlinux+kde plasma5的环境,看到同事的macbook pro支持很多手势操作(gestures),自己也希望在archlinux和kde的环境下配置方便的手势 ...
Window环境下配置MySQL 5.6的主从复制、备份恢复
Window环境下配置MySQL 5.6的主从复制.备份恢复 1.环境准备 Windows 7 64位 MySQL 5.6 主库:192.168.103.207 从库:192.168.103.208 ...
Mac环境下配置Java开发环境（jdk+maven+tomcat+idea）
记录下在Mac环境下配置java开发环境,包括jdk,maven,tomcat和idea 下载及安装jdk 首先到官网下载jdk,这里就用目前官网最新的9.0.4 无脑双击安装就可以: 配置jdk 进 ...
Windows环境下配置环境变量
安装好MySQL后,在Windows环境下配置环境变量 1)新建MYSQL_HOME系统变量配置MySQL的安装路径:C:\Program Files\MySQL\MySQL Server 8.0 ...
JDK5.0环境下配置PKCS#11
JDK5.0环境下配置PKCS#11 发表日期:2008-1-5 新浪微博 QQ空间 QQ微博百度搜藏腾讯朋友 QQ收藏百度空间人人网开心网这篇文章不介绍具体的编程方法,而是针对PKCS# ...

宝塔环境下配置PM2+NODE+VUE+WEBPACK环境

宝塔环境下配置PM2+NODE+VUE+WEBPACK环境相关推荐

最新文章

热门文章