vueファイル（単一ファイルコンポーネント）をwebpackでビルド
.vueファイル（単一ファイルコンポーネント）をwebpackでビルドする手順を紹介します。 バージョンは、Vue.jsは2.x、webpackは2.xです。 わかりやすくするため、空のプロジェクトから出来る限り最小構成で作成していきます。（nodejsとnpmはインストール済みとします） package.jsonの作成最初にpackage.jsonを作成します。いろいろと質問されますが、すべて何も入力せずに全てEnterキーをクリックしていけば問題ありません。 babelのインストールbabelを使うと、ES2015 (ES6)などで書かれたソースコードを一般的なブラウザがサポートしているECMAScript5の形式に変換できます。 babel-core babel-loader babel-preset-es2015 babel-preset-stage-0の４つのパッケージをインスト
Webpacker + Vue + Vuex + ActionCable で動作するサンプルを作った話 - Qiita
はじめに Qiita では初めまして、主に ProjectHL2 という名義で活動している何でも屋のおじさんです。 小さなソフトウェア開発会社でエンジニアをやっており、主に Ruby on Rails を用いた業務システム開発を行っておりました。 最近は会社にも後輩のエンジニアが増え、フロントやモバイルの開発もバンバン行うようになり、こうした技術についてもっと世のエンジニアの皆さんとも共有して行きたい（ついでに仕事も欲しい）と思い記事を書いていく事にしました。 今後ともよろしくお願いします。 動機 元々 React + Redux はたまたま実案件でご一緒させて頂いたエンジニアさんと「全然分からないんですか！僕もです、やりましょう！」といった流れで勉強しました。意味不明ですが、人生とはそういうものだと思います。 ともあれ Vue + Vuex でも同じような事ができそうだったので、後輩エン
electron 上で vue.js を動かす - Qiita
概要 node.js も vue.js も初心者のプログラマが、electron 上で vue.js を動かす方法を紹介するだけの記事です。 プラットフォームは Windows7、node.js のバージョンは 6.10.2、vue のバージョンは 2.3.2 で書きました。 準備 node.js のインストール 公式サイトからダウンロードとインストールを行います。コマンドプロンプトで と打って、バージョン番号が表示されたら成功です。 パッケージのインストール（グローバル） npm コマンドを使い、electron-prebuilt と webpack をインストールします。 ここでは -g オプションを付けて、グローバルインストールを行っています。
vue-router webpackでページごとにファイルを分割する
vue-routerでシングルアプリケーションを作成していると、ページ数が増えるにしたがって作成されるjsファイルのファイルサイズもどんどん増えていきます。 ページごとにファイルを分割し、そのページがアクセスされたタイミングでそのjsファイルを読み込むようにすれば最初のロード時間を短縮できます。 一見実装が難しそうですが、vue-routerとwebpackを使えば簡単に実現できます。 以下の説明の開発環境やフォルダ構成はvue-routerを導入してSPAを作成するで扱ったものと同様とします。 router.jsの修正コンポーネントの読み込み方法を以下のように設定します。 router.jsimport Vue from 'vue'; import VueRouter from 'vue-router'; Vue.use(VueRouter); const routes = [ { pa
Vue.js on Rails / vue-js-on-rails
マネーフォワード Pay for Businessのフロントエンド / Money Forward Pay for Business Frontend
Vue.js + Brunch: The Webpack Alternative You've Been Hungry For
Vue.js + Brunch: The Webpack Alternative You've Been Hungry For Imagine if there was a build tool that you could use for Vue.js projects that compiled faster than Webpack, gave you a smaller bundle size and required only a few lines of configuration. Brunch is that tool. In this article, I'll show you how incredibly easy it is to set up a Vue.js + Brunch project, cover some of the pros and cons of
Vue.jsとUIkitでつくるフロントエンド環境 - Qiita
最近社内ではVue.jsが流行っています。 世間でも人気は上々のようで、混沌としたフロントエンドフレームワーク界隈でも一番気軽に使えると評判です。 UIkitはbootstrapなどと同じようなスタイルライブラリです。 あんまり巷では噂は聞かないのですが使い勝手がよくこちらも業務で愛用しております。 UIkitがver.3になってWebpackでインポート出来るようになったのでスターターキットを作成しました。 UIkitが3になって個人的に嬉しかったのはWebpack対応とScss版が出来たこと。 ちなみにUIkitの公式サイトもVue.jsで作成されています。 そこで今回はスターターキットの説明をしながらVue.js,UIkitのよいところを書こうと思います。 ※UIkitの説明がメインになってしまったのでVue.js,vue-loader,Webpackとかわかんねえよって方は意味不明
Vue.js 1.x から 2.0 への移行のポイント
{ topic = [".NET", "PowerShell", "Ubuntu", "LibreOffice", "Arduino", ...] } 先日Vue.js 1.xから2.0への移行を行った。まるっと書き換えないといけないというレベルではないが、メジャーバージョンアップだなぁと感じる程には違いを感じられたのでいくつかポイントを書いておく。 もちろん、Vue.jsの機能を全て使いこなしているわけではないため、すべて網羅しているとはとても考えていないので、詳しくは「Migration from Vue 1.x」を参照してほしい。 大きな違い：テンプレートが事前コンパイルできるようになったVue 1.xと2.xの大きな違いは、テンプレートのコンパイルと実行を分離できるようになったこと。実際に移行してみた感じ、このコンパイル処理の邪魔になるようなことに関しては排除するような形で変更され
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
