2016-12-06 8 views
0

私は以前、以下のようにCDNから角度を使用していました。npmからの回転角度?

<script src="//code.angularjs.org/1.4.0/angular.js"></script> 

ノードからアプリケーションインデックスをロードする方法は次のとおりです。次のように

app.use(function (req, res) { 
    res.sendFile(__dirname + '/client/index.html'); 
}); 

しかし、browserifyのようなものを使用して、すべてをバンドルしようとするのを期待して...私はちょうどNPM代わりにCDNのnode_modulesから角度を角度のインストール、および含まれています。

<script src="/node_modules/angular/angular.js"></script> 

しかし、次のエラーが表示されるようになりましたが、私の角度は認識されていないようです。

Uncaught SyntaxError: Unexpected token <    angular.js:1 

角度アプリをロードするには、どうすればnpm verisonを使用できますか?

+0

使用角度CLI、セットアップにその超簡単のようなスクリプトタグを追加し、軌道に乗る、角度はじめと問題の多くを解決します。 https://github.com/angular/angular-cli – Paddy

+0

@Paddyもし私が間違っていないのであれば... CLIはAngular 2用です。私はまだAngular 1.4を使用しています。 – Grateful

+0

@greateful、申し訳ありません、バージョン1.4.0をスキム。はい、それは、このエラーはあなたがnode_modulesからの角度含めるとは何の関係もありません> – Paddy

答えて

0

使用express.static

+0

わかりましたので、ちょうど確認するために...あなたは基本的に私は(それを追加すると、再実行するために私のアプリを有効にしているので)直接私のapp.jsに 'express.static'を使用してnode_modulesを追加すべきではないことを言っているのではなく、私がすべきビルドプロセスでクライアントディレクトリにコンテンツをコピーしてください。あれは正しいですか?そして、これで 'browserify'を使うことについて、あなたは何を言っていますか? – Grateful

+0

私はbrowserifyを使用すると、クライアントファイル内に結果ファイルを含めることができます。 – Grateful

+0

はい正確に..あなたのためにこれを自動的に行うbrowserfiy/webpackを使用してください。 – harishr

1

は私が

app 
|-node_modules 
|-src 
    |-client 
     |-index.html 
    |-app.js 

のようなディレクトリ構造を前提としpublic DIRまたは他の使用のWebPACKにビルドプロセスの一環として、すべての静的コンテンツをコピーし、静的コンテンツをサーブの名前を渡しますディレクトリに格納されています。これは、静的資産がexpress.staticミドルウェア機能に含まれているため、app.jsから直接ファイルを提供し始めます。

/* app.js */ 
var express = require('express'); 
var path = require('path'); 
var app = express(); 
app.use(express.static(path.join(__dirname,'../'))); 

<script src="./node_modules/angular/angular.js"></script> 
+0

私はコンセプトを理解していますが、あなたのコードは完全ではありません。 'express.static'でパス' ../'を追加しましたが、パス内のどこにも 'node_modules'という言葉が出ています。それは' app.js'内のどこかにあります。 'node_modules'からの何かが、アプリケーションで許可されていない場合、クライアント側でどのように認識されるのでしょうか? – Grateful

+0

私は共有可能資産のパスを設定しました。ここのカレントディレクトリ '__dirname'は' /app/src/'です。だから私はapp' path.join(__ dirname、 '.. /') 'へのパスを設定しました。今すぐ明示ミドルウェアはappの下のすべての共有可能な資産、すなわちindex.htmlを通じて 'node_module/angular/angular.js'の下にアクセスすることができます。あなたの応答送信コードの上にapp.jsコードを追加します(あなたの質問に記載されています)。これが便利だと思う。 – eigenharsha

関連する問題