zoukankan      html  css  js  c++  java
  • vue-cli2 打包

    npm run build 打包安装 相当于静态资源

    解决vue-cli项目打包出现空白页和路径错误的问题

    路径错误的问题解决方式:

    打开config文件夹下的 index.js 找到如下图所示区域: 

    build中 assetsPublicPath: '/', 改为 assetsPublicPath: './',

    build: {
        // Template for index.html
        index: path.resolve(__dirname, '../dist/index.html'),
    
        // Paths
        assetsRoot: path.resolve(__dirname, '../dist'),
        assetsSubDirectory: 'static',
        assetsPublicPath: '/',
        productionSourceMap: true,
        devtool: '#source-map',
        productionGzip: false,
        productionGzipExtensions: ['js', 'css'],
    
        bundleAnalyzerReport: process.env.npm_config_report
      }

    页面空白的问题解决如下

    router-view中的内容显示不出来。路由history模式。

    这个坑是当你使用了路由之后,在没有后端配合的情况下就手贱打开路由history模式的时候,打包出来的文件也会是一片空白的情况,

    很多人踩这个坑的时候花了很多时间,网上的教程基本上都是说的第一个坑,这个坑很少有人提起。

    这里并不是不能打开这个模式,这个模式需要后端设置的配合,详情可以看:路由文档

    内容有了可是本地图片显示错误:

    由此可见导致问题的原因仍然是路径问题,解决方法如下: 
    打开 build 文件夹下的 utils.js 文件,找到以下部分加入publicPath:'../../',即可。如下显示

    if (options.extract) {
          return ExtractTextPlugin.extract({
            use: loaders,
            publicPath:'../../',
            fallback: 'vue-style-loader'
          })
        } else {
          return ['vue-style-loader'].concat(loaders)
        }
      }
    

      

  • 相关阅读:
    fedora 24 使用扇贝网页版没有声音
    Fedora 23安装 NS2 (network simulator 2)
    如何扩大LVM 逻辑分区的大小?
    code::blocks编译出错
    Fedora 23 忘记root密码
    u盘安装Fedora23
    Derived 派生类
    移动点的坐标
    进栈 出栈
    C和C++语言&
  • 原文地址:https://www.cnblogs.com/mary-123/p/10947723.html
Copyright © 2011-2022 走看看