Rodhos Soft

備忘録を兼ねた技術的なメモです。Rofhos SoftではiOSアプリ開発を中心としてAndroid, Webサービス等の開発を承っております。まずはご相談下さい。

webpack

開発用サーバ

WebPackの開発用サーバを使う。 webpack-dev-serverをnpmでインストール。 webpack.config.jsに devServer: { contentBase: path.resolve(__dirname, 'app'), port: 3000 } を等と設定、また、outputのpublicPathも追加してcontentBaseに合わせておく(そうし…

plugin

webpack plugin webpack pluginは apply(compiler) {} を持つクラスとして定義して、 webpack.config.jsにおいて plugins: [ new HelloPlugin() ] のように入れてやれば良い。 const pluginName = 'HelloPlugin'; class HelloPlugin { apply(compiler) { com…

出力先

pathを絶対パスに変換してoutputで指定してやれば良い。 const path = require('path'); module.exports = { // or production mode: 'development', entry: { menu:'./src/main.ts'}, output: { path: path.resolve(__dirname, 'app/dist') },

html埋め込み

webpackのhtml-loaderを使ってhtmlをjavascriptで読み込んだ使う。 html-loaderのインストール。 npm install html-loader webpack.config.jsを設定 module.exports = { entry: './app.js', output: { path: __dirname + "/dist", filename: "bundle.js"; },…

webpackの使い方

WebPack https://webpack.js.org/ 読み込んで使う。エントリーポイント //spc/index.js import bar from './bar'; bar(); 読み込まれる側 //src/bar.js export default function bar() { // } これを設定するにはwebpack.config.jsを作る。 const path = req…