zoukankan      html  css  js  c++  java
  • Vue打包上线部署

    一、路径问题

    1、脚手架+webpack打包通过npm run build,但是后台tomcat部署上线的时候,会衍生出一些问题,比如,路径问题(因为在项目中,我们使用了绝对路径,这里必须要使用相对路径,但是打包后还是会报错,说是找不到assets文件夹下的各种资源,包括images,css,js,是因为,在当初在全局引用的时候写在了index.html中,安全起见,可以写在app.vue中);

    2、在打包前还要在config文件夹中的index.js中设置一个路径问题,不然也会报错,在js中找到build:{assetsPublicPath:'/'},默认路径是‘/’,需要加上'.',写成、'./’(一般正常编辑代码是只进行本步修改即可)。

    二、favicon.ico问题

    1、favicon图标也在index.html中引入了link的那句话,这个可以在build文件夹中的webpack.dev.conf.js

    中的new HtmlWebpackPlugin({

    favicon:'./logo.ico'

    })加上这个路径,便可以找到这个图标了。

    三、静态资源找不到问题

      

    配置文件一:build>>>utils.js (修改publicPath:"../../" , 这样写是处理打包后找不到静态文件(图片路径失效)的问题)

    四、打包好后可以自己测试运行是否正常问题

    1、这个时候需要用到node中的express,方法如下:

    安装express:npm install -g express

    最新版的express4.0版本中将命令工具分家出来,还需要安装一个命令工具:npm install -g express-generator

    创建一个express工程:express helloworld

    进入项目主目录:cd helloworld

    安装必备包:npm install

    启动express程序:npm start

    最后把打包好的dist文件夹放在public文件夹里,访问http://localhost:3000/dist就能看的项目了,这样测试好后,就可以丢给后台了。

  • 相关阅读:
    vue2.0 之 douban (二)创建自定义组件tabbar
    vue2.0 之 douban (一)框架搭建 及 整体布局
    react-navigation
    react-native modal
    javascript-使用el表达式获取后台传递的数据
    java Map
    java List集合
    javascript 自定义Map
    javascript Array(数组)
    ZOJ 3868 GCD Expectation (容斥+莫比乌斯反演)
  • 原文地址:https://www.cnblogs.com/lan-cheng/p/9554428.html
Copyright © 2011-2022 走看看