Building a pure offline Meteor app

后端 未结 1 1169
悲&欢浪女
悲&欢浪女 2020-12-04 12:01

Seems to be some questions about how one can use Meteor offline when there\'s no internet connection here on Stack Overflow, but I\'m interested in if it\'s possible to buil

相关标签:
1条回答
  • 2020-12-04 12:21

    You can build a purely offline Meteor app but there are a few 'weird' compromises.

    • Meteor is a bit forceful when it comes to making a DDP connection, so it is made to 127.0.0.1 as a sort of null loopback, since there is no server.

    • Meteor already builds the app in this offline-only way since the Cordova system was introduced, so its just extracting that out pretty much. There are builds for server, web.cordova and browser.

    1 ) Bundle your app and extract it out

    I'll just make a random example out of the todo app (it requires a server side bit, but well ignore that)

    meteor create --example todos
    cd todos
    meteor bundle ~/Desktop/app.tar.gz
    cd Desktop
    tar xvzf app.tar.gz
    

    2) In bundle there is a directory at /programs/web.browser, this is the framework of your offline app so take that directory and put it somewhere.

    3) There are two files with a hash as the filename. Rename them as app.js and app.css

    4) There is a directory called app. Move all its contents up to the main directory, i.e

    cd app
    mv * ../
    rm -r app
    

    5) Create a index.html file with the following in it:

    <!DOCTYPE html>
    <html>
    
    <head>
        <link rel="stylesheet" href="app.css?meteor_css_resource=true">
        <script type="text/javascript">
        __meteor_runtime_config__ = {
            "meteorRelease": "1.0.0",
            "ROOT_URL": "/",
            "ROOT_URL_PATH_PREFIX": "",
            "autoupdateVersion": "00000",
            "DDP_DEFAULT_CONNECTION_URL": "127.0.0.1"
        };
        </script>
    
        <script type="text/javascript" src="app.js"></script>
    
        <script type="text/javascript">
        if (typeof Package === 'undefined' ||
            !Package.webapp ||
            !Package.webapp.WebApp ||
            !Package.webapp.WebApp._isCssLoaded())
            console.log("Load Fail");
        </script>
    
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=0">
        <meta http-equiv="content-language" content="en">
        <meta name='apple-mobile-web-app-capable' content='yes' />
        <meta name='apple-mobile-web-app-status-bar-style' content='black' />
        <title>Your App</title>
    </head>
    
    <body>
    
    </body>
    
    </html>
    

    and voila:

    Keep in mind this app *needs* a server so its quite useless this way, but you can make a purely client side app

    Keep in mind this app needs a server so its quite useless this way, but you can make a purely client side app if you wanted.

    Other considerations:

    • Use file based html paths for images, fonts and other files (file.jpg instead of /images/file.jpg)

    • With iron router its a bit tricky but you can't use / you'll have to use index.html and relative paths

    • You can remove redundant packages in meteor-platform that you will not use, such as autoupdate

    • There are a few packages on atmosphere that help with data storage such as ground:db instead of mongo collections which require a server side.

    0 讨论(0)
提交回复
热议问题