Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Doc addition: Migrating from other templates #132

Open
Wolfr opened this issue May 24, 2020 · 7 comments
Open

Doc addition: Migrating from other templates #132

Wolfr opened this issue May 24, 2020 · 7 comments

Comments

@Wolfr
Copy link
Collaborator

Wolfr commented May 24, 2020

Doc addition. Any feedback welcome. Text starts below the line.

Migrating from svelte-template

Did you start your project using svelte-template but have decided you need a router? No worries. It's easy to transfer over your project to use Routify instead.

  1. Copy over the dependencies and the npm tasks from package.json.

  2. Copy over the full content from rollup.config.js

  3. Put whatever static assets you had in the public folder into a new folder called static

  4. Within your src folder, make sure the contents of App.svelte are the following:

<script>
  import { Router } from "@sveltech/routify";
  import { routes } from "@sveltech/routify/tmp/routes";
</script>

<Router {routes} />
  1. Within your src folder, create a folder called pages
  2. Within pages, create a file called index.svelte. This will correspond to /.
  3. Now run npm i to install the necessary dependencies; and run npm run dev to run Routify's dev server.

Optional

If you are looking to deploy your project to Now or Netlify, look in the scripts folder and copy the files you need.
@kevmodrome kevmodrome mentioned this issue May 24, 2020
Open
19 tasks
@Wolfr
Copy link
Collaborator Author

Wolfr commented May 24, 2020 •
edited by jakobrosenberg
Loading

How to migrate your Sapper project to Routify

Assuming you started from sapper-template, do the following.

  1. Copy over the dependencies and the npm tasks from routify-starter's package.json.
  2. Copy over the full content from routify-starter's rollup.config.js
  3. Delete the following files in src: client.js, server.js
  4. Rename the routes folder to pages
  5. Move template.html to static/__index.html. You will have to remove the specific things like marked with %sapper%. Make any changes you feel necessary to correspond as much as possible to this file - most notably add the __SCRIPT__ marker somewhere in your <head> section.

Main layout and navigation

Remove any references to the segment prop as it does not exist in Routify. Refer to how to build up your navigation in Routify.

404 page

Remove _error.svelte and replace it with _fallback.svelte.

Remove files related to Cypress

If you won't use use cypress tests; remove the cypress folder and cypress.json in the root

Remove files related to server routes

If you used any server routes (Files with .json.js): these won't work with Routify, you will have to rewrite this code. The sapper template ships with a blog which uses a server route to retrieve posts.

Remove files related to PWA

  1. Remove src/service-worker.js
  2. Remove manifest.json from static

@jakobrosenberg
Copy link
Member

Don't know how this issue eluded me. Great job, @Wolfr!

Should we post them?

@Wolfr
Copy link
Collaborator Author

Wolfr commented Jun 30, 2020

Thank you, we might want to add this to the site yes. I am now going through all issues and pruning them.

@tv42
Copy link

tv42 commented Aug 21, 2020 •
edited
Loading

I think this part got out of date, or at least does things differently from the starter template:

  import { routes } from "@sveltech/routify/tmp/routes";

https://github.com/roxiness/routify-starter/blob/3b56ed4484f5c82728eed4b04c248d10a4a27da9/src/App.svelte#L3

  import { routes } from "../.routify/routes";

@jakobrosenberg
Copy link
Member

The starter template recently changed routifyDir to .routify. Either approach is fine though.

@tv42
Copy link

tv42 commented Aug 22, 2020

It seems the /tmp/ thing was broken by yarn2 making node_modules read-only. Writing to node_modules seems sketchy, to me.

@jakobrosenberg
Copy link
Member

As of recent package managers, node_modules has indeed become flaky. If you're interested in doing a PR, I'll be happy to merge it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@Wolfr @tv42 @jakobrosenberg