Vue项目打包部署到iis服务器的配置方法
2019-10-14 18:06
5860 查看
一 将Vue项目打包
切换到项目目录下,输入cnpm run build
打包
等待打包完成
二 URL 重写
访问我们的一个url
原因是vue不是根据项目目录的地址访问的,是根据vue-router转发路由访问url,在这里我们应该进行url rewrite
url write的方式有两种,一种是在iis下载url rewrite工具配置规则
另一种是配置web.config文件,我用的是第二种
web.config内容
<?xml version="1.0" encoding="UTF-8"?> <configuration> <system.webServer> <staticContent> <remove fileExtension=".woff" /> <mimeMap fileExtension=".woff" mimeType="font/x-woff" /> <remove fileExtension=".woff2" /> <mimeMap fileExtension=".woff2" mimeType="font/x-woff2" /> <remove fileExtension=".ttf" /> <mimeMap fileExtension=".ttf" mimeType="font/x-ttf" /> <remove fileExtension=".json" /> <mimeMap fileExtension=".json" mimeType="text/json" /> </staticContent> <rewrite> <rules> <rule name="vue" stopProcessing="true"> <match url=".*" /> <conditions logicalGrouping="MatchAll"> <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" /> <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" /> </conditions> <action type="Rewrite" url="/" /> </rule> </rules> </rewrite> </system.webServer> </configuration>
将该文件拷贝到打包好根目录下面
发现成功访问到我们的url
总结
以上所述是小编给大家介绍的Vue项目打包部署到iis服务器的配置方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!
您可能感兴趣的文章:
相关文章推荐
- vue项目打包部署到服务器的方法示例
- vue vue-cli webpack打包部署上线前的配置操作,初建vue项目 webpack打包需要注意的配置
- VUE 中配置生产环境和发布环境配置不同的接口地址 (运行npm run dev的时候,运行的是测试接口。npm run build打包项目的时候,打包的是服务器正式接口)
- Vue-CLI 3.X 部署项目至生产服务器的方法
- 记录一次vue+springboot项目打包部署到服务器上
- webpack+vue-cil 配置接口地址代理以及将项目打包到子目录的方法
- 【配置阿里云 I】申请配置阿里云服务器,并部署IIS和开发环境,项目上线经验
- vue项目中运用webpack动态配置打包多种环境域名的方法
- Angular 项目打包之后,部署到服务器,刷新访问404解决方法
- Vue项目服务器部署之子目录部署方法
- vue项目打包后生成一个配置文件可以修改打包后的服务器api地址
- linux服务器下部署项目修改配置使请求路径前自动加上项目名称 附 直接请求ip访问方法
- vue、react等单页面项目部署到服务器的方法及vue和react的区别
- Maven项目部署到服务器设置访问路径以及配置虚拟目录的方法
- Vue项目webpack打包部署到服务器的实例详解
- Vue项目webpack打包部署到服务器
- 把vue-router和express项目部署到服务器的方法
- vue项目打包部署_nginx代理访问方法详解
- vue项目打包部署到tomcat或nginx服务器
- Vue项目webpack打包部署到服务器