記事一覧
Nuxt.js ページスクロール時に要素にclass付与
ページスクロールしてフェードしながら要素を出したいときなどに使う公式ドキュメントにも書いてあるので、そこが一番参考になる。
plugins/scroll.js (v-scroll=""を使えるようにする。)
import Vue from 'vue'Vue.directive('scroll', { inserted: function (el, binding) { let
Nuxt.js ページ遷移時の処理
ページ遷移時のタイミングで処理をしたいpluginでページ遷移時の処理を書き、nuxt.config.jsで読み込む方法がある。
例. plugins/routerOption.js
export default async ({ app,store }) => { app.router.afterEach((to, from) => { let page_name; pag
Nuxt.configについて
head内にgoogle tag managerなどのscriptを挿入するhead:{ script:[ { innerHTML: "ここにscript内記述" } ], __dangerouslyDisableSanitizers: ['script']}
generate先フォルダを変えるgenerate:{ dir: "hoge/test" }
loca
Nuxt.js ルーティング(nuxt-linkによる動的切り替え)
ルーティングの定義pagesフォルダがこのような構成だった場合、
pages/--| index.vue--| projects/----| index.vue----| _id.vue
以下のようにルーティングが定義される。
router: { routes: [ { name: 'index', path: '/', component: 'pages/ind
Nuxt.js プロジェクト作成手順とフォルダの種類
プロジェクト作成vue init nuxt-community/starter-template my-app
パッケージのインストールcd my-appyarn #パッケージのインストールyarn dev #サーバー起動
ディレクトリ構造assets
画像、css(scss)、Javascriptの管理。
webpackでコンパイルなどしたいファイルを置く。
components
Vueコ