[解決済み] Angular2のTypeScriptファイルとJavaScriptファイルを別のフォルダに分ける(多分'dist')。
質問
私は 5分クイックスタート を使用していますが、このようなファイル構造になっています。
angular2-quickstart
app
app.component.ts
boot.ts
index.html
license.md
package.json
tsconfig.json
tsconfig.jsonはこのようなコードブロックになっています。
{
"compilerOptions": {
"target": "ES5",
"module": "system",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": false
},
"exclude": [
"node_modules"
]
}
package.jsonも。
{
"name": "angular2-quickstart",
"version": "1.0.0",
"scripts": {
"tsc": "tsc",
"tsc:w": "tsc -w",
"lite": "lite-server",
"start": "concurrent \"npm run tsc:w\" \"npm run lite\" "
},
"license": "ISC",
"dependencies": {
"angular2": "2.0.0-beta.0",
"systemjs": "0.19.6",
"es6-promise": "^3.0.2",
"es6-shim": "^0.33.3",
"reflect-metadata": "0.1.2",
"rxjs": "5.0.0-beta.0",
"zone.js": "0.5.10"
},
"devDependencies": {
"concurrently": "^1.0.0",
"lite-server": "^1.3.1",
"typescript": "^1.7.3"
}
}
sourceMapをtrueからfalseに変更すると、コードエディタではマップファイルは生成されなくなりますが、jsファイルは生成されたままです。
tsファイルだけを操作したいので、jsファイルやjs.mapファイルを大量に取得したくありません。tsファイルをすべてappフォルダのような通常のdevelop floderに入れ、jsファイルやjs.mapファイルをすべてdistというフォルダに入れるには、どうしたらよいでしょうか?
この良い例は、次のようなものです。 angular2-webpack-quickstart . しかし、私は彼らがそれを行う方法を理解していなかった?
それを行う方法任意のアドバイス、もちろん手動ではありません。
ありがとうございます。
どのように解決するのですか?
遅ればせながら、2ステップの解決策をご紹介します。
ステップ1
変更
system.config.js
を更新することで
'app'
を
'dist/app'
:
var map = {
'app': 'app', // 'dist/app',
.
.
.
};
これで、次のようになります。
var map = {
'app': 'dist/app', // 'dist/app',
.
.
.
};
ステップ2
を作成します。
ディスト
フォルダーを作成します。
編集
tsconfig.json
を追加してください。
"outDir": "dist"
その結果
tsconfig.json
:
{
"compilerOptions": {
.
.
.
.
"outDir": "dist" // Pay attention here
},
"exclude": [
.
.
.
]
}
実行
npm start
を実行すると、コンパイルされたすべての
.js
と
.map.js
ファイルを
ディストリビューション
フォルダの中にあります。
ノート : 他の回答にも目を通してください。彼らはあまりにも非常に有用で有益である。
関連
-
[解決済み】angular2 + typescriptアプリケーションにlodashをインポートする。
-
[解決済み] モバイルWeb HTML5フレームワークの選び方【終了しました
-
[解決済み] JavaScriptで、ある文字列が別の文字列の中に出現するすべてのインデックスを見つけるにはどうすればよいですか?
-
[解決済み] JavaScriptのtoString()関数をオーバーライドして、デバッグ用に意味のある出力を提供することは可能でしょうか?
-
[解決済み] 無効になっている入力フィールドの値を送信する
-
[解決済み] モデルフェッチ時に1をtrueに、0をfalseに変換する方法
-
[解決済み] $.ajax実行中にローディングイメージを表示する
-
[解決済み] Chromeのwebkitインスペクタで「Unsafe JavaScript attempt to access frame with URL...」というエラーが継続的に発生する。
-
[解決済み] JavaScriptで長い配列を小さい配列に分割する方法
-
[解決済み] jQueryを使用して、すべてのクリックイベントハンドラを削除するにはどうすればよいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] 上級者向けJavaScript。この関数はなぜ括弧でくくられるのですか?重複
-
[解決済み] Google maps API V3 - 同一地点に複数のマーカーを設置する。
-
[解決済み] reactのrender関数でdynamic hrefを作成するには?
-
[解決済み] モバイルWeb HTML5フレームワークの選び方【終了しました
-
[解決済み] node.jsで文字列のsha1ハッシュを取得するにはどうすればよいですか?
-
[解決済み] JavaScriptを使用してHTML要素に属性を追加/更新するには?
-
[解決済み] 無効になっている入力フィールドの値を送信する
-
[解決済み] jQueryで入力ファイルが空かどうかをチェックする方法
-
[解決済み] JavaScriptで長い配列を小さい配列に分割する方法
-
[解決済み] Chrome拡張機能:popup.htmlを強制終了させる