当我跑npm run build的时候,我面临着用相对路径进行正确构建的困难.解析assets资源 很容易,但我不知道如何配置两件事:

1/config/index.js中的assetsPublicPath

// see http://vuejs-templates.github.io/webpack for documentation.
var path = require('path')
module.exports = {
  build: {
    env: require('./prod.env'),
    index: path.resolve(__dirname, '../dist/index.html'),
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: '/ONLY_ABSOLUTE_PATH_ARE_ALLOWED/',
    productionSourceMap: true,
    // Gzip off by default as many popular static hosts such as
    // Surge or Netlify already gzip all static assets for you.
    // Before setting to `true`, make sure to:
    // npm install --save-dev compression-webpack-plugin
    productionGzip: false,
    productionGzipExtensions: ['js', 'css']
  },
  dev: {
    env: require('./dev.env'),
    port: 8080,
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {},
    // CSS Sourcemaps off by default because relative paths are "buggy"
    // with this option, according to the CSS-Loader README
    // (https://github.com/webpack/css-loader#sourcemaps)
    // In our experience, they generally work as expected,
    // just be aware of this issue when enabling this option.
    cssSourceMap: false
  }
}

2/vue-router配置中的base选项似乎也只接受绝对路径...

const router = new VueRouter({
  mode: 'history',
  base: '/ABSOLUTE_PATH_ONLY/',
  routes: [
    { path: '/', redirect: '/fr/poster/home' },
    { path: '/:lang', redirect: '/:lang/poster/home' },
    {
      path: '/:lang/poster',
      component: PosterLayout,
      children: [
        {
          // UserProfile will be rendered inside User's <router-view>
          // when /user/:id/profile is matched
          name: 'home',
          path: 'home',
          component: Home
        },
        {
          // UserPosts will be rendered inside User's <router-view>
          // when /user/:id/posts is matched
          name: 'themeCover',
          path: ':theme',
          component: ThemeCover
        }
      ]
    },
    {
      name: 'themeDetails',
      path: '/:lang/theme/:theme',
      component: ThemeDetails
    }
  ]
})

"在future 的情况下,它是正确的,所以它是修改的URL"的情况下,它是正确的...

如果这个问题可以解决的话,有什么办法解决吗?

推荐答案

我知道从你写的帖子到现在一切都变了.但现在,使用最新版本的Vue和Vue Cli,您可以通过Vue配置文件获得它(我不是该平台的专家):

  1. 在项目的主路径上创建一个"vue.config.js"文件

  2. 给出一个相对路径.例子:

    module.exports = {
        publicPath: './'
    };

它不适用于css中添加的字体,我不知道为什么,我还在谷歌上搜索.如果有人能读书,那就太好了.

Vue.js相关问答推荐

VueJS不会呈现一个名为None的组件""

Vuetify从同一方向旋转传送带下一个项目和上一个项目

在 Nuxt3 中使用 Vue3 vue-ganntastic 插件

Nuxt 和 Vite 有什么区别?

如何使用 async/await 在 vue js 中添加标头

Vue 脚本标签中更漂亮的 destruct 功能

vue 计算的 ant watch 不会在嵌套属性更改时触发

查找未销毁的 Vue 组件

在组件之间共享 websocket 连接

使用数组元素的计算(computed)属性

如何在Typescript语言Vuejs中使用watch功能?

Vuetify Datatable - 在所有列上启用内容编辑

Vue.js 中的 mount挂载是什么意思?

Vue Cli 3 不允许我在 Webpack 中处理 SVG

为 Vue 组件动态添加属性

如何使用 JavaScript 按索引删除数组元素?

如何使用 Vue Test utils 测试输入是否聚焦?

如何在 Promise 回调中更新 Vue 应用程序或组件的属性?

Vue.js 中的条件 依赖于props值?

超过最大调用堆栈大小 Vuetify