Не удается найти node_modules после развертывания

Question

Этот заголовок может быть немного обманчивым, но, пожалуйста, несите меня какое-то время.

Я сделал простое приложение Angular2 на визуальной студии 2015 года, и теперь у меня есть published it on Azure.

Наличие node_modules в среде разработки было совершенным, но после его развертывания отображается сообщение об ошибке, которое не может найти node_modules.

Вот как я имею в виду в моем окр разработки в index.html -

<!-- Polyfill(s) for older browsers --> 
    <script src="/node_modules/core-js/client/shim.min.js"></script> 
    <script src="/node_modules/zone.js/dist/zone.js"></script> 
    <script src="/node_modules/reflect-metadata/Reflect.js"></script> 
    <script src="/node_modules/systemjs/dist/system.src.js"></script> 
    <script src="/systemjs.config.js"></script> 

Ее также называют в system.config.js -

/** 
* System configuration for Angular 2 samples 
* Adjust as necessary for your application needs. 
*/ 
(function(global) { 

// map tells the System loader where to look for things 
var map = { 
'app':      '/app', // 'dist', 

'@angular':     '/node_modules/@angular', 
'angular2-in-memory-web-api': '/node_modules/angular2-in-memory-web-api', 
'rxjs':      '/node_modules/rxjs' 
}; 

// packages tells the System loader how to load when no filename and/or no extension 
var packages = { 
'app':      { main: 'main.js', defaultExtension: 'js' }, 
'rxjs':      { defaultExtension: 'js' }, 
'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' }, 
}; 

var ngPackageNames = [ 
'common', 
'compiler', 
'core', 
'forms', 
'http', 
'platform-browser', 
'platform-browser-dynamic', 
'router', 
'router-deprecated', 
'upgrade', 
]; 

// Individual files (~300 requests): 
function packIndex(pkgName) { 
packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' }; 
} 

// Bundled (~40 requests): 
function packUmd(pkgName) { 
packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' }; 
} 

// Most environments should use UMD; some (Karma) need the individual index files 
var setPackageConfig = System.packageWithIndex ? packIndex : packUmd; 

// Add package entries for angular packages 
ngPackageNames.forEach(setPackageConfig); 

// No umd for router yet 
packages['@angular/router'] = { main: 'index.js', defaultExtension: 'js' }; 

var config = { 
map: map, 
packages: packages 
}; 

System.config(config); 

})(this); 

Ошибка имеет смысл, так как у меня есть файл .gitignore, который не позволяет узлу_модулям развертываться на сервере.

Может кто-то, пожалуйста, помогите, как я могу запустить его после развертывания и какие изменения могут быть сделаны с помощью вышеуказанных ссылок, чтобы заставить его работать.

Answer 1

Вы должны либо развернуть node_modules как часть пакета или есть скрипт запустить npm install для вас, чтобы получить пакеты из package.json

Чтобы получить пакеты в файле package.json сделать npm install --save package-you-want-to-install

Тогда вы можете установить скрипт запуска из пакета json, попробовав скрипт по этой ссылке https://github.com/woloski/nodeonazure-blog/blob/master/articles/startup-task-to-run-npm-in-azure.markdown

Answer 2

Я не использовал SystemJS, но ваша щедрость заставляла меня попробовать ответить в любом случае, так как это l ooks, как будто вам все еще нужен ответ. :)

После того, как взглянуть на некоторые документы SystemJS, похоже, что ваш index.html должен отличаться для разработки и использования. Это то, что документы показывают для development:

<script src="systemjs/dist/system.js"></script> 
<script> 
    SystemJS.import('/js/main.js'); 
</script> 

И это то, что они показывают для production (обратите внимание на первой линии имеет другой src путь):

<script src="systemjs/dist/system-production.js"></script> 
<script> 
    SystemJS.import('/js/main.js'); 
</script> 

Что еще более важно, принять к сведению, что node_modulesне ссылка в любом случае, и не должно быть. Если ваш код и конфигурация настроены правильно, SystemJS (как и другие инструменты сборки) упакует все, что вам нужно, без каких-либо дополнительных тегов <script>. Вместо этого вы должны импортировать свои прокладки (и аналогичные) из своего кода где-нибудь. Например, в своем руководстве по Webpack (Webpack - еще один инструмент сборки, который выполняет аналогичную роль для SystemJS), команда Angular показывает файл polyfills.ts, который импортирует их прокладки, затем они включают файл polyfills в сборку в пределах их webpack configuration.

Извините, но я не могу предложить более конкретные советы о SystemJS, в частности, но, надеюсь, этого ответа достаточно, чтобы указать вам в правильном направлении.

Answer 3

Одна вещь, которую вы можете сделать, это установить пакеты, необходимые на сервере Azure через панель приборов Kudu.

1. Перейти к https://yoursitename.scm.azurewebsites.net
2. Затем Debug консоли -> CMD
3. Перейти на главную \ сайт каталог \ Wwwroot
4. Тип НПХ установки

Это позволит установить необходимые пакеты для Углового 2 для запуска на сервере Azure.

Answer 4

Не используйте system.config.js

Вы должны связать его первый. Не загружайте node_modules в Azure. Чтобы связать ссылку ниже ссылку.

How to bundle an Angular app for production

После того, как вы связывайте расстояние папка будет создана. Вы можете загрузить папку dist в Azure.

Answer 5

НПМ устанавливать свои DEPS на прод окр ..

npm i --production