Question

请，我尝试将我的Laravel-Vuejs应用程序托管在托管服务器中，但是它不起作用。

我在Web检查器中收到了此消息

DevTools failed to parse SourceMap: http://sample.com/myproject/js/bootstrap.js.map
app.js:107387 app vue
app.js:18929 You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
See more tips at https://vuejs.org/guide/deployment.html

我总是空白页（未加载组件），请问如何解决。谢谢

Package.json

{
    "private": true,
    "scripts": {
        "dev": "npm run development",
        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "watch": "npm run development -- --watch",
        "watch-poll": "npm run watch -- --watch-poll",
        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
        "prod": "npm run production",
        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
    },
    "devDependencies": {
        "axios": "^0.18",
        "bootstrap": "^4.1.3",
        "cross-env": "^5.2.0",
        "jquery": "^3.2",
        "laravel-mix": "^2.0",
        "lodash": "^4.17.4",
        "popper.js": "^1.14.4",
        "vue": "^2.5.17"
    },
    "dependencies": {
        "bootstrap-vue": "^2.0.0-rc.11",
        "cross-spawn": "^6.0.5",
        "css-loader": "^0.28.11",
        "moment": "^2.22.2",
        "style-loader": "^0.21.0",
        "vee-validate": "^2.0.9",
        "vue-moment": "^4.0.0",
        "vue-progressbar": "^0.7.5",
        "vue-router": "^3.0.1",
        "vue-scrollspy": "^0.1.3",
        "vue-spinner": "^1.0.3",
        "vue-template-compiler": "^2.5.17",
        "vue2-scrollspy": "^2.3.1",
        "vuejs-datepicker": "^1.5.2",
        "vuex": "^3.0.1",
        "webpack-dev-server": "^3.1.5"
    }
}

webpack.mix.js

let mix = require('laravel-mix');

mix.js('resources/assets/js/app.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css');

Answer 1

您需要将Vue转到生产模式，

您可以通过将以下行添加到您的app.js中来实现

Vue.config.devtools = false

Answer 2

我已解决问题，并与您分享解决方案：

这种问题取决于您应用路由器的基本URL，因为我的情况base: __dirname是问题，所以我将其更改为base: '/project_name/public/，一切正常。

谢谢大家的帮助。

Answer 3

Laravel已成为开发PHP项目的最受欢迎的选择。如此受欢迎的一个重要原因是对Vue.js的内置支持，Vue.js是一个快速增长的JavaScript库，用于开发令人印象深刻的前端。

这种组合结果是快速，安全和令人印象深刻的应用程序，它们需要最少的时间从构思到最终代码审核。对Vue.js的支持意味着Laravel开发人员可以在其应用程序中轻松使用Vue组件，而不会浪费时间编写组件的集成。

Host you Laravel Vuejs spa

Laravel Vuejs在托管服务器中部署应用程序

3 个答案: