vue.js - 创建构建后。运行构建时显示空白页

Question

运行yarn build获取 dist 文件夹后。运行index.html时我得到白色的空白页。

文件结构：-

:~/Desktop/web$ ls  

    babel.config.js  docs  node_modules  public     src            yarn.lock
    dist             log   package.json  README.md  vue.config.js

vue.config.js

module.exports = {
    publicPath: "./", 
    chainWebpack: config => {
      config.plugins.delete('prefetch');
    },
    devServer: {
        host: 'localhost',
        https: false,
        port: 8080, 
        public: 'localhost'
    },  
}

网页输出：-

控制台输出：-

OneSignalError.js:18 Uncaught (in promise) f: OneSignal: This web push config can only be used on https://example.com. Your current origin is http://localhost:8080.
    at Function.checkRestrictedOrigin (https://cdn.onesignal.com/sdks/OneSignalPageSDKES6.js?v=151508:1:243516)
    at Function.<anonymous> (https://cdn.onesignal.com/sdks/OneSignalPageSDKES6.js?v=151508:1:243076)
    at Generator.next (<anonymous>)
    at r (https://cdn.onesignal.com/sdks/OneSignalPageSDKES6.js?v=151508:1:716)
GET http://localhost:8080/sockjs-node/info?t=1632898657676 net::ERR_CONNECTION_REFUSED
GET http://localhost:8080/sockjs-node/info?t=1632898659676 net::ERR_CONNECTION_REFUSED
GET http://localhost:8080/sockjs-node/info?t=1632898662675 net::ERR_CONNECTION_REFUSED

标签： vue.jsvuejs2deploymentbuildonesignal

Answer 1

问题是您正在使用来自 Vue 的本地服务器测试 OneSignal，但您在 OneSingal 配置中输入了 corbid360.com 作为您的 URL。测试 OneSignal 所需要做的是将 OneSignal 仪表板内的 URL 从 Vue 项目更改为本地服务器。在本地环境中测试后，您可以将其更改回 corbid360.com

最可能的原因是您需要向 OneSignal 指定您正在使用 localhost。

1. 选择典型设置
2. 输入您的本地主机 URL
3. 启用本地测试（将 HTTP localhost 视为 HTTPS 进行测试）

加入我们的 Discord 服务器，了解更多关于我们的社区和 OneSignal 的信息：https ://onesignal.com/onesignal-developers