質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Cordova

Cordovaは様々なデバイスで使うことができるオープンソースなモバイル用開発プラットフォームです。開発者に各デバイスの元のプラットフォームで開発する必要をなくし、HTML・JavaScript・CSSなどの一般的なウェブのテクノロジーを使ってすべてのデバイスで展開することができるモバイルのアプリケーションを生成することを可能にします。

Monaca

「Monaca」はiOS、Android、Windows向けのアプリ開発に対応した、Cordovaベースのモバイルアプリ開発プラットフォームです。HTML5、JavaScriptといったWeb標準技術を用いてモバイルアプリ開発を行うことができます。

Q&A

1回答

711閲覧

Monaca CLI にてプロジェクトのトランスパイルに失敗する

BluOxy

総合スコア2663

Cordova

Cordovaは様々なデバイスで使うことができるオープンソースなモバイル用開発プラットフォームです。開発者に各デバイスの元のプラットフォームで開発する必要をなくし、HTML・JavaScript・CSSなどの一般的なウェブのテクノロジーを使ってすべてのデバイスで展開することができるモバイルのアプリケーションを生成することを可能にします。

Monaca

「Monaca」はiOS、Android、Windows向けのアプリ開発に対応した、Cordovaベースのモバイルアプリ開発プラットフォームです。HTML5、JavaScriptといったWeb標準技術を用いてモバイルアプリ開発を行うことができます。

0グッド

1クリップ

投稿2018/07/10 17:04

編集2022/01/12 10:55

やりたいこと

Monaca CLIにてトランスパイルを行いたい
(Monacaプロジェクトをトランスパイルし、実機で動作確認できれば方法は何でも良い)
Angular2のプロジェクトでmonaca transpileがしたかった

経緯

  1. MonacaのクラウドIDEにて「Onsen UI V2 Angular Navigation」プロジェクトを作成
  2. Monaca CLIを使うためにnode.jsをインストールし、npm install -g monacaした
  3. Monaca CLI上で、ログインをしてからmonaca import

「Onsen UI V2 Angular Navigation」プロジェクトをインポート
0. プロジェクトのディレクトリに移動しmonaca transpile すると以下の応答が返ってくる

Running Transpiler... module.js:549 throw err; ^ Error: Cannot find module 'ホームディレクトリ.cordova\node_modules\webpack' at Function.Module._resolveFilename (module.js:547:15) at Function.Module._load (module.js:474:25) at Module.require (module.js:596:17) at require (internal/module.js:11:18) at Object.<anonymous> (C:\Program Files\nodejs\node_modules\monaca\node_modules\monaca-lib\src\transpile.js:4:15) at Module._compile (module.js:652:30) at Object.Module._extensions..js (module.js:663:10) at Module.load (module.js:565:32) at tryModuleLoad (module.js:505:12) at Function.Module._load (module.js:497:3)

nw@0.26.6をインストールしたら、注意は消えました。)

分かっていること

実際にホームディレクトリ.cordova\node_modules\webpackを確認してみると以下のような状態です。
![.cordova直下に何もない

この後、.cordova上でnpm install webpackをした後
もう一度monaca trasnpileをしたら以下の表示になりました。

Running Transpiler... C:\Users\RoyDeffrayeur\MatchingApplication2\webpack.prod.config.js:17 throw new Error('Missing Webpack Build Dependencies.'); ^ Error: Missing Webpack Build Dependencies. at Object.<anonymous> (ホームディレクトリ\作成したプロジェクト\webpack.prod.config.js:17:9) at Module._compile (module.js:652:30) at Object.Module._extensions..js (module.js:663:10) at Module.load (module.js:565:32) at tryModuleLoad (module.js:505:12) at Function.Module._load (module.js:497:3) at Module.require (module.js:596:17) at require (internal/module.js:11:18) at Object.<anonymous> (C:\Program Files\nodejs\node_modules\monaca\node_modules\monaca-lib\src\transpile.js:5:21) at Module._compile (module.js:652:30) Project has failed to transpile. Error has occured while transpiling ホームディレクトリ\作成したプロジェクト with webpack. Please check the logs.

エラーに出ているwebpack.prod.configでは、最初の20行目程度まで以下のようなソースになっています。
見た感じでは、ホームディレクトリ/.cordva/nodemodules経由でプラグインのモジュールを参照しているように見えます。

javascript

1try { 2 var path = require('path'); 3 var os = require('os'); 4 var cordovaNodeModules = path.join(os.homedir(), '.cordova', 'node_modules'); 5 6 var webpack = require(path.join(cordovaNodeModules, 'webpack')); 7 var HtmlWebpackPlugin = require(path.join(cordovaNodeModules, 'html-webpack-plugin')); 8 var ExtractTextPlugin = require(path.join(cordovaNodeModules, 'extract-text-webpack-plugin')); 9 var CopyWebpackPlugin = require(path.join(cordovaNodeModules, 'copy-webpack-plugin')); 10 var ProgressBarPlugin = require(path.join(cordovaNodeModules, 'progress-bar-webpack-plugin')); 11 12 var cssnext = require(path.join(cordovaNodeModules, 'postcss-cssnext')); 13 var postcssImport = require(path.join(cordovaNodeModules, 'postcss-import')); 14 var postcssUrl = require(path.join(cordovaNodeModules, 'postcss-url')); 15 16} catch (e) { 17 throw new Error('Missing Webpack Build Dependencies.'); 18}

知りたいこと

  • Missing Webpack Build Dependenciesが出る原因
  • 公式ドキュメントを見る限りはmonacaのinstallだけで事足りそうだが、他に手順が必要なのか

長くなりすみません。
何か思い当たりのある方、ご教授よろしくお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

monaca importしたアプリのルートディレクトリ上でmonaca reconfigureしたらトランスパイルできませんか?

投稿2018/08/30 00:39

tsumasakky-tera

総合スコア10

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問