在 XAMPP 上使用 Vue CLI 3

Question

一点背景..

如前所述https://forum.vuejs.org/t/how-to-make-webpack-vue-work-on-xampp/33808。 它有效 当我像这样将我的 Vue 项目直接放在 htdocs 中时。

 htdocs/
  | - css/
  | - js/
  | etc..

但是我使用它的方式不同，这里是 htdocs.

中我当前的文件结构

htdocs/
 | - project1/
 |    | - css/
 |    | - some other stuff for project1
 | - project2/
 |    | - css/
 |    | - some other stuff for project2
 | - vue-project/ (Where I wanted my Vue went to)
 |    | - css/
 |    | - stuff..

我把我的vue项目的dist/直接放到htdocs/vue-project的时候报错是404，因为他们直接回到了根文件（root是htdocs/），其中找不到启动 Vue 项目所需的文件！

我想要的

任何可以在 htdocs/vue-project/ 中启动项目的东西。将接受配置 Vue/Webpack 或 XAMPP 本身中的任何设置的任何答案。如果您需要其他信息，请在评论部分询问。

如果事实证明没有其他方法，那么我会接受涉及 XAMPP 配置的答案，以了解如何在不同的目录中启动服务器。就像在 htdocs 中启动服务器一样，other-file 也很棒。

Answer 1

对于之前的 Vue CLI 3.x

尝试更改 config/index.js 中 build 对象下的 assetsPublicPath。然后在那里附加您的文件夹名称。可能有帮助的类似问题 https://forum.vuejs.org/t/vue-js-webpack-deployment-for-xaamp-testing/28970

如果使用 vue-router 则添加 ROUTER_BASE。 https://router.vuejs.org/en/api/options.html#base

对于 Vue CLI 3

在您的 vue 项目中创建 vue.config.js
在其中只需添加以下内容

module.exports = {
    publicPath: "/{path-to-your-vue-project}"
}

有关更多信息，请参阅此文档 https://cli.vuejs.org/config/#publicpath

在 XAMPP 上使用 Vue CLI 3

Using Vue CLI 3 on XAMPP

xampp

vuejs2

vue-cli-3