A Nuxt.js Template using below:
- Nuxt.js
- TypeScript
- Sass
- Buefy: is integrate Bulma
- nuxt-i18n: is integrate vue-i18n and vue-i18n-loader
- Sitemap Modules
- Google Analitics Module
- SSR on Firebase Cloud Functions
- Auto Deploy using CirecleCI
nuxt and nuxt-i18n are GREATE softoware, but difficult to set up...
Therefore, we have put together one template and frequently used ones so that projects corresponding to SEO and internationalization can be launched easily.
Please checkout or download this repository.
Please change your confingures for env.development.js
and env.production.js
.
env.development.js
... use in development mode; ex.nuxt
commandenv.production.js
... use in production mode; ex.nuxt build
command
module.exports = {
baseUrl: "http://localhost:3000",
contactFormUrl: "TODO_YOUR_CONTACT_FORM_URL",
policyUrl: "TODO_YOUR_PRIVACY_POLICY_URL",
tosUrl: "TODO_YOUR_TERMS_OF_SERVICE_URL",
twitterUrl: "TODO_YOUR_TWITTER_URL",
firebaseConfig: "TODO_YOUR_FIREBASE_CONFIG",
GA_ID: "TODO_YOUR_GOOGLE_ANALYTICS_ID"
};
Each values is:
baseUrl
: base URL of your sitecontactFormUrl
: contact form URL for your sitepolicyUrl
: privacy policy page for your sitetosUrl
: terms of service page for your sitetwitterUrl
: twitter URL for youfirebaseConfig
: firebase config json for youGA_ID
: Google Analitics Tracking ID for you
commonHead.js
is described common html head.
Please change the following variables according to your setting.
Default values is:
const keyword = "MemoryLovers,めもらば";
const copryright = "© 2019 Memory Lovers.";
const twitterId = "@MemoryLoverz";
commonHead.js
is described config for Cirecle CI.
Please change the following variables according to your setting.
environment:
FIREBASE_PROJECT: YOUR_FIREBASE_PROJECT_ID
FIREBASE_TOKEN: YOUR_FIREBASE_TOKEN
# launch dev mode
npm run dev
# build
$ npm run build
# build & launch firebase serve
$ npm run build && npm run serve
# if you need
$ firebase use
# build & deploy
$ npm run build && npm run deploy
Please see app/assets/css/buefy.scss
.
Please see app/assets/msg/common.json
And, you can use <i18n>
in each .vue
files. Please see vue-i18n-loader.
Please see:
commonHead.js
... Common HTML head: use in all pages.app/mixins/HeadMixinx.ts
... mixins HTML head: use in each pages.
HeadMixinx.ts
generates HTML head based on headInfo(): HeadInfo
of each page.
ex: headInfo()
of IndexPage
return message keys of title adn description.
export default class IndexPage extends mixins(HeadMixin) {
name:string = 'HomePage';
public headInfo(): HeadInfo {
return {
title: "home_title",
description: "home_details"
};
}
}
Memory Lovers (GitHub / WebSite / Twitter)
We develop Trans-Notes is web service.
Trans-Notes is a web service with the following features:
- Tanslate multi language at once
- Manage base message and translated messages
- Export multi format: ex. Android XML, CSV and "nuxt-i18n JSON"!!
We think that using Trans-Notes makes internationalization easier.
Sorry, we don't ready English version yet.. Now we are preparing an English version.
Please try it!!