search

Metnew / suicrux

🚀 Ultimate universal starter with lazy-loading, SSR and i18n. [not maintained]
Apache License 2.0
942 stars 131 forks source link

Manifest: Line: 1, column: 1, Unexpected token. #17

Closed empz closed 7 years ago

empz commented 7 years ago

Cloned the repo, did yarn, then yarn run dev and yarn run db and while the project loads, it throws an error Manifest: Line: 1, column: 1, Unexpected token. in Chrome. When going to the Application tab in devtools and clicking in manifest.json it shows the following instead of the manifest.

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>React-Semantic.UI Starter</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

    <link rel="shortcut icon" type="image/x-icon" href="/images/logo.png">
    <!-- Disable tap highlight on IE -->
    <meta name="msapplication-tap-highlight" content="no">

    <!-- Add to homescreen for Chrome on Android -->
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="application-name" content="React-Semantic.UI-Starter">
    <link rel="icon" sizes="192x192" href="images/touch/chrome-touch-icon-192x192.png">

    <!-- Add to homescreen for Safari on iOS -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="React-Semantic.UI-Starter">
    <link rel="apple-touch-icon" href="images/touch/apple-touch-icon.png">

    <!-- Tile icon for Win8 (144x144 + tile color) -->
    <meta name="msapplication-TileImage" content="images/touch/ms-touch-icon-144x144-precomposed.png">
    <meta name="msapplication-TileColor" content="#2F3BA2">

    <!-- Web Application Manifest -->
    <link rel="manifest" href="manifest.json">

    <!-- Theme Color -->
    <meta name="theme-color" content="#1b1c1d">
</head>

<body>
    <div id="app"></div>
    <noscript>
        You are using outdated browser. You can install modern browser here: <a href="http://outdatedbrowser.com/" >http://outdatedbrowser.com</a>.
    </noscript>
<script type="text/javascript" src="/client.js"></script></body>

</html>

Also, the service worker doesn't seem to be running. Or does it only run in production mode?

Metnew commented 7 years ago

Hi, thanks for your issue! SW works only in production, because it caches build results. I tested manifest.json only in production build and probably currently it will not works correctly in dev mode, because there is no need in manifest.json in development + it will be replaced soon with FaviconsWebpackPlugin. I'm currently working on big update in which your issue will be fixed.

empz commented 7 years ago

I figured. Thanks!

Any plans on doing a version with MobX instead of Redux? Or at least without Redux?

I'd like to use these starter but with TypeScript and MobX. A lot of things to modify and I'm no expert in these technologies so I'm already having errors all over the place.

Metnew commented 7 years ago

Probably, Redux will be used in a future, but there will be many improvements: lazy loading, styled-component + SSR.

Also, starter is based on Semantic-UI(hah, probably it's obvious) which is not 100% good choice for performance-first apps (semantic uses full lodash bundle as dependency + minified styles are 548 kb without gzip), so lazy loading is a requirement. If your project isn't so big, I recommend you to use Preact instead of React. Preact is much smaller in size.

Also, some notes: if you're planning to use SSR, than maybe you need to select another UI framework, because (as I understood after using Semantic in my projects) Semantic doesn't support SSR with inline styles.

empz commented 7 years ago

Thanks for your quick reply.

Actually I don't want or need SSR.

I still like your starter since it uses SUI, which I love, but also a solid structure with good performance and even a testing framework. But I do not like Redux and I prefer Typescript over babel.

Metnew commented 7 years ago

Personally, I don't like TypeScript, but maybe I need to think about an alternative for Redux in this project, thanks for your idea) Maybe a custom CLI generator (like CRA or ng utils) or a yeoman generator will be a good solution.

empz commented 7 years ago

Well, that would be amazing!

malixsys commented 6 years ago

@Metnew I know you said you don't like TypeScript but it's getting a LOT of momentum lately, and IDE support is getting VERY nice! What say you? :) http://www.typescriptlang.org/docs/handbook/migrating-from-javascript.html