导航:首页 > IDC知识 > vue服务器

vue服务器

发布时间:2020-07-31 07:15:23

1、vue.js把原项目build下,放在服务器上,如果以后要更新内容,怎么更新啊,是在原项目文件更新在bulid下吗

是,一般脚本都是直接删除dist文件夹然后重新构建生成dist放到目标文件夹
你说的是服务器有一套开发环境和代码,然后在服务器构建,不建议这样做,毕竟很浪费服务器空间,小东西可以这样做。也可以直接把测试环境测试通过的代码迁移到正式环境上

2、vue.js怎么获取服务器时间

// 获取时间通过JavaScript就可以
var date = new Date(); // 通过Date对象就可以获取本地时间。

vue是一套JavaScript的渐进式MVVM框架,跟获取服务器时间没有什么关系,通过元素就js就可以获取时间。

3、vuejs怎么在服务器部署

既然是布署,哪默认就应该是生产环境下的布署,vue开发的应用本质上就是静态文件,无论你用何种web服务器,放上去就应该能通过http访问

接下来我来帮大家来捋一捋

首先VUE 是一个javascript的前端框架,注定了它是运行在浏览器里的,对服务器本地没有任何要求,只要一个静态文件服务器能通过http访问到其资源文件就足矣!无论你是用apache ,ngnix 就算你要用node 自己实现一个静态文件服务器,也用不了多少行代码。

npm run dev 是用来在本地开发的时候做调试用的,vue开发的是前端的东西,不是nodejs 服务端程序,按道理讲,生产环境里就不该存在npm,甚至nodejs也不需要(用nodejs来做web静态服务的除外),楼主通过ssh进入到服务器里,再运行npm run dev 来启动哪是开发机上做的事情。正确的做法很简单,通过npm run build 把生成的dist文件夹(不要上传文件夹)里的内容上传到http服务器上就可以通过 http来访问了,开发机上正常,上传以后 程序出现错误不能运行的原因99.99%的可能性是你引用资源的路径有问题。

一般如果vue框架的程序上传到网站服务器的根目录下是不 会有问题的,也不存在资源文件引用错误的情况,但如果你不是根目录,就会有问题,通过vue-cli 生成的开发目录,build以后默认引用资源文件的路径是

有更多疑问 ”可以咨询 ”小鸟云,它是的一家服务器厂商,我一直在用他们产品!

4、vue发布到服务器一个目录下,路由怎么配置

首先VUE 是一个javascript的前端框架,注定了它是运行在浏览器里的。
对服务器本地没有任何要求,只要一个静态文件服务器能通过http访问到其资源文件。
无论你是用apache ,ngnix 就算你要用node 自己实现一个静态文件服务器,也用不了多少行代码。

5、vue如何将项目部署到服务器上并且使外网能够访问到

你的服务器是什么系统啊 ,,,linux LINUX、WINDOWS、NETWARE、UNIX。。

在linux

首先服务器安装node git nginxvue-cli

安装好nginx 用你的公网ip访问就可以看到 下面的页面

然后进入到下面的路径

vi default 你会看到nginx的默认配置

默认监听80端口 根路径

把你写好的vue项目 上传到github ,通过git clone 克隆到

服务器

路径下面

然后npm/yarn add/install 安装依赖 然后npm run build

vi 打开html 下面的 index.html 可以看到

nginx默认的html

进入sites-enabled 发现 它里面的 default 来自 sites-available的default

所以需要在 sites-available 新建一个文件 你的项目名命名就可以

在你新建的文件

我在site-available新建的文件是note-admin 映射到 sites-enables

注意路径一定要写全

最后重新加载下 nginx -s reload

打开浏览器 公网ip:端口号或者 域名访问

这就可以了

还有 用express 部署这个 简单些

6、怎么把VUE项目部署到服务器上面

1.使用xshell登录到阿里云服务器。安装nginx(本文安装到/etc下)

[plain] view plain copy

cd /etc  

apt-get update  

apt-get install nginx  

2.首先先配置nginx,然后再根据配置文件做下一步操作

打开/etc/nginx/nginx.conf文件

[plain] view plain copy

vim /etc/nginx/nginx.conf  

在nginx.conf中配置如下:

[plain] view plain copy

user www-data;  

worker_processes auto;  

pid /run/nginx.pid;  

events {  

        worker_connections 768;  

        # multi_accept on;  

}  

http {  

  

        ##  

        # Basic Settings  

        ##  

  

        tcp_nodelay on;  

        keepalive_timeout 65;  

        types_hash_max_size 2048;  

        # server_tokens off;  

  

        # server_names_hash_bucket_size 64;  

        # server_name_in_redirect off;  

  

        include /etc/nginx/mime.types;  

        default_type application/octet-stream;  

  

        ##  

        # SSL Settings  

        ##  

  

        ssl_protocols TLSv1 TLSv1.1 TLSv1.2; # Dropping SSLv3, ref: POODLE  

        ssl_prefer_server_ciphers on;  

  

        ##  

        # Logging Settings  

        ##  

  

        access_log /var/log/nginx/access.log;  

        error_log /var/log/nginx/error.log;  

  

        ##  

        # Gzip Settings  

        ##  

  

        gzip on;  

        gzip_disable "msie6";  

  

        # gzip_vary on;  

        # gzip_proxied any;  

        # gzip_comp_level 6;  

        # gzip_buffers 16 8k;  

        # gzip_http_version 1.1;  

  

        ##  

        # Virtual Host Configs  

        ##  

  

  

        gzip on;  

        gzip_disable "msie6";  

  

        # gzip_vary on;  

        # gzip_proxied any;  

        # gzip_comp_level 6;  

        # gzip_buffers 16 8k;  

        # gzip_http_version 1.1;  

        # gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;  

  

        ##  

        # Virtual Host Configs  

        ##  

  

        include /etc/nginx/conf.d/*.conf;  

        include /etc/nginx/sites-enabled/*;  

        #以下为我们添加的内容  

       server {               

              listen 80;  

              server_name your-ipaddress;  

  

              root /home/my-project/;  

              index index.html;  

              location /datas {  

              rewrite ^.+datas/?(.*)$ /$1 break;  

              include uwsgi_params;  

              proxy_pass http://ip:port;  

                              }  

             }  

}  

接下来就根据配置文件进行下一步工作。配置文件中的server_name后面是阿里云服务器的ip地址

3.配置文件中的listen是nginx监听的端口号,所以需要在阿里云服务器上为80端口添加安全组规则

在本地的浏览器登录阿里云服务器->进入控制台->点击安全组->点击配置规则->点击添加安全组规则,之后配置如下(注:入方向和出方向都要配置)


4.配置文件中的root和index那两行表示我们把项目文件夹放在/home/my-project下

例如有两个项目文件夹分别为test1,test2,里面都有index.html。则目录结构如下

/home

     |--my-project

            |--test1

                    |--index.html

            |--test2

                    |--index.html

则在浏览器输入http://ip/test1/index.html

服务器便会在/home/my-project中找到test1下的index.html执行;

如果在浏览器中输入http://ip/test2/index.html

服务器便会在/home/my-project中找到test2下的index.html执行;

这样便可以在服务器下放多个项目文件夹。

5.所以我们也需要在本地项目的config/index.js里的build下进行修改,如果要把项目放到test1下,则

[javascript] view plain copy

assetsPublicPath: '/test1/',  

如果用到了vue-router,则修改/router/index.js

[javascript] view plain copy

export default new Router({  

  base: '/test1/',   //添加这行  

  linkActiveClass: 'active',  

  routes  

});  

6.nginx配置文件中的location则是针对跨域处理,表示把对/datas的请求转发给http://ip:port,本文中这个http://ip:port下就是需要的数据,例如http://ip:port/seller,在本地项目文件中ajax请求数据的地方如下

[javascript] view plain copy

const url = '/datas/seller';  

this.$http.get(url).then((response) => {  

  .....  

});  

7.修改后在本地命令行下运行:cnpm run build 生成dist文件。把dist文件里的index.html和static文件上传到服务器的/home/my-project/test1下,目录结构如下

/home

     |--my-project

            |--test1

                    |--index.html

                    |--static

8.启动nginx

[plain] view plain copy

service nginx start  

9.至此项目部署成功,在浏览器下输入:http://ip/test1/index.html即可

     

      

7、vue.js 本地 怎么做服务器渲染

从官方给出的渲染方案能看出,后端只是在页面硬塞了数据及数据状态进去,就效果而论渲染的工作还是前端负责,所以其他后端也能做到。具体看例子写script标签到页面那段.
vue的服务端渲染,目前发现下面两个包可以实现nodejs向其他服务器请求数据。我现在用的是axios,因为我看到axios同时支持nodejs和浏览器。

8、vue2.5.2是用什么创建的服务器

Vue-cli使用Node开启一个开发环境服务器

9、运行VUE项目,总是失败,服务器可以启动,页面出现Cannot GET /

使用排除法吧,首先你这个项目是第一次创建的吗?如果是,去创建项目的文件夹看看有没有生成node_moles文件夹。如果没有,去配置里面把缓存删除再重新创建项目。如果是把已有项目重新开发的话,先npm install然后再npm run dev

与vue服务器相关的知识