vue-cli webpack-simple 模板 打包上线浏览

一、首先用vue-cli 生成一个webpack-simple模板的项目,名为webpack-simple-demo

     1、 vue init webpack-simple webpack-simple-demo  

     2、进入到项目里面  cd webpack-simple-demo

     3、加载项目所需要的模块  npm install 

     4、启动项目  npm run dev 

     

二、打包上线

发现webpack模块的项目和webpack-simple模块的项目打包后生成的文件是不一样的,webpack模块可以直接打包后直接访问,而webpack-simple不可以,意思就是webpack-simple打包后不能再file路径下访问,需要再http路径下访问,所以用到了IIS。

      1、打包 npm run build

       同样会生成一个dist文件

      2、将dist文件和index.html文件放到一个新的文件夹下面 webpack-simple-demo-iis

      3、IIS部署

          打开控制面板,点开程序与服务

         

         点开:  启用或关闭Windows功能

 

         会出现这个页面,找到  Internet information services (Internet信息服务),勾选全部,

IIS 选择完成,接下来添加网站。

三、添加 打包的 webpack-simple-demo-iis 网站

1、开始 菜单搜索 IIS,选择Internet信息服务(IIS)管理器,点击进入

   

  

网站右击选择 添加网站,输入自定义网站名(可以是项目名,比较好找),选择物理路径(项目发布文件的路径),接下来设置端口号,一定要设置且不能重复。80端口默认的不能使用,随便输入一个没有被用过的即可。主机名不要填,否则别人访问不了。点击确定就好了。

确定后,网站中就会出现新添加的网站

 

已标记关键词 清除标记
©️2020 CSDN 皮肤主题: 编程工作室 设计师:CSDN官方博客 返回首页