如何從node_modules文件夾導入腳本

我試圖讓一個ASP5應用程序跟隨教程運行Angular 2.0。經過幾步之後，我意識到當我嘗試在沒有互聯網連接的情況下工作時，它不起作用（我通常在坐在火車上時正在處理它）。當然，通過本教程建議的進口量將沒有互聯網連接的工作：如何從node_modules文件夾導入腳本

<script src="https://code.angularjs.org/2.0.0-beta.1/angular2-polyfills.js"></script> 
<script src="https://code.angularjs.org/tools/system.js"></script> 
<script src="https://code.angularjs.org/2.0.0-beta.1/Rx.js"></script> 
<script src="https://code.angularjs.org/2.0.0-beta.1/angular2.dev.js"></script>

因此，我想包括我node_modules本地文件夾是這樣的：

<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script> 
<script src="node_modules/systemjs/dist/system.js"></script> 
<script src="node_modules/rxjs/Rx.js"></script> 
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>

的文件存在並且是正確的。但是當我嘗試調試這個項目時，我會在所有四個文件中得到以下錯誤：SyntaxError: missing ; before statement，當我通過瀏覽器查看這些文件時，我收到的所有文件都是其中包含Hello World!的文件。我顯然似乎錯過了一些東西，但因爲我以前從來沒有用過整個npm部分，所以我不知道爲什麼會發生這種情況，並且經過Google搜索幾個小時後，似乎沒有人看到這個問題。

訪問限制？缺少JS模塊？任何人都可以解釋我如何可以在我的html中包含來自我的node_modules文件夾的文件？

來源

2016-04-27 Otto Abnormalverbraucher

你想要做的就是使用Webpack並讓它爲你提供模塊化的捆綁依賴和文件。 –

在Asp.Net 5/wwwroot文件是默認的根目錄爲Web應用程序，所以當你輸入：

node_modules/angular2 /包/ angular2-polyfills.js

其在以下實際搜索路徑：

的wwwroot/node_modules/angular2 /捆綁/ angular2-polyfills.js

雖然在項目根即存在於文件

node_modules/angular2/bundles/angular2-polyfills.js

但是由於它不在Web應用程序根目錄中，因此您會看到這些腳本的404錯誤。

解決方案是將這些文件複製到wwwroot文件夾。

我建議寫一飲而盡任務自動將文件複製到wwwroot文件/腳本/ lib文件夾

，然後你可以使用它們像這樣：

//Sample Gulp file code 
var paths = { 
    npmSrc: "./node_modules/", 
    libTarget: "./wwwroot/lib/" 
}; 

var libsToMove = [ 
    paths.npmSrc + '/es6-shim/es6-shim.min.js', 
    paths.npmSrc + '/angular2/es6/dev/src/testing/shims_for_IE.js', 
    paths.npmSrc + '/angular2/bundles/angular2-polyfills.min.js', 
    paths.npmSrc + '/systemjs/dist/system.js', 
    paths.npmSrc + '/rxjs/bundles/rx.min.js', 
    paths.npmSrc + '/angular2/bundles/angular2.dev.js', 
    paths.npmSrc + '/angular2/bundles/router.js', 
    paths.npmSrc + '/angular2/bundles/http.min.js', 
];

然後在你的HTML頁面或視圖中，您可以用這些像這樣：

<script src="~/lib/es6-shim.min.js"></script> 
<script src="~/lib/shims_for_IE.js"></script> 
<script src="~/lib/angular2-polyfills.min.js"></script> 
<script src="/lib/system.js"></script> 
<script src="~/lib/rx.min.js"></script> 
<script src="/lib/angular2.dev.js"></script> 
<script src="/lib/router.js"></script> 
<script src="/lib/http.min.js"></script>

你應該看到在你的項目的根一飲而盡文件，如果它不是隻需在項目的根目錄下創建一個名爲「gulpfile.js」的文件。

我希望這可以幫助:)

來源

2016-04-27 23:21:06

「〜/」在src屬性中是什麼意思？ –

如何從node_modules文件夾導入腳本

回答

相關問題