Йомен внутри ExpressJS

Я все равно хотел бы попробовать пример с w/Yeoman и Express.

Я попробовал следующее, и он работал "хорошо", но я застрял в слиянии маршрутов. (более упрощенный для удобочитаемости)

mkdir test
cd test
express
mkdir app
cd app
mkdir js
cd js
yeoman angular

Затем я изменил "output: dist" на "output:../../public" в файле Gruntfile.js

Теперь оба сервера работают нормально (например, yoman server и node app.js). Я также могу запустить "yeoman build" для вывода миниатюрного JS в /public в экспресс-приложении.

Я немного расплывчатый о том, как маршруты могут сливаться? Я хотел бы/вытащить маршрут Angular, а не экспресс-маршрут и т.д. Примеры angular -express-seed в github выглядят нормально, но мне все равно хотелось бы, чтобы Йоман интегрировался в проект.

Любые предложения будут оценены.

Ответ 1

Я бы рекомендовал эту структуру для yoman + expressjs:

mkdir app
cd app
yeoman angular
express .

Итак, ваше дерево должно выглядеть так:

.
├── app
│   ├── 404.html
│   ├── favicon.ico
│   ├── index.html
│   ├── robots.txt
│   ├── scripts
│   │   ├── controllers
│   │   │   └── main.js
│   │   ├── vendor
│   │   │   ├── angular.js
│   │   │   ├── angular.min.js
│   │   │   ├── es5-shim.min.js
│   │   │   └── json3.min.js
│   │   └── yeoman-test.js
│   ├── styles
│   │   └── main.css
│   └── views
│       └── main.html
├── app.js
├── Gruntfile.js
├── package.json
├── public
│   ├── images
│   ├── javascripts
│   └── stylesheets
│       └── style.css
├── routes
│   ├── index.js
│   └── user.js
├── test
│   ├── lib
│   │   └── angular-mocks.js
│   └── spec
│       └── controllers
│           └── main.js
├── testacular.conf.js
└── views
    ├── index.jade
    └── layout.jade

Вы можете удалить теперь избыточную директорию public (мы будем использовать вместо app):

rm -rf public

И теперь в app.js вам нужно изменить, какой каталог экспортирует статические файлы. Измените эту строку:

app.use(express.static(path.join(__dirname, 'public')));

app.use(express.static(path.join(__dirname, 'app')));

И это должно быть об этом. Там один карат в том, что у вас теперь есть два "индексных" файла - один в views/index.jade, а другой в app/index.html. Удаление app/index.html в настоящее время ломает yoman, поэтому мой совет состоит в том, чтобы избавиться от маршрута для app/index.jade и просто внести изменения в index.html.

Надеюсь, это поможет!

Ответ 2

Вот еще немного другая настройка

yo angular

обновить Gruntfile.js, чтобы изменить конфигурацию из 'app' в 'public'.

то do

express .

откройте приложение app.js и убедитесь, что нет сопоставления маршрутов, например, app.get('/', routes.index); Это значит, что сервер node фактически будет обслуживать index.html, тот же файл, который загружается при запуске "сервера grunt".

Теперь идите и удалите общедоступный каталог, а затем переместите каталог приложения в общедоступный

rm -rf public
mv app public

Ответ 3

Этот проект, похоже, охватывает все требования (и даже имеет дополнительную поддержку MongoDB): https://github.com/DaftMonk/generator-angular-fullstack

Я только что попробовал его локально, и он работает:

npm install -g generator-angular-fullstack

yo angular-fullstack [appname]

Дополнительную информацию см. на странице GitHub.

Ответ 4

Я бы прокомментировал ответ @btford, если бы у меня была репутация -

Просто хотел добавить, что установка express . после yo angular будет перезаписывать созданный grunt файл package.json, который сломает хрюканье, как сообщается @jjperezaguinaga.

Перед установкой express . обязательно сохраните копию package.json. Затем добавьте следующие зависимости к исходному package.json:

"dependencies" : { 
  "express": "3.3.4",
  "jade": "*"
}

Ответ 5

У меня возникают проблемы с этим решением: экспресс по-прежнему пытаются загрузить index.jade вместо index.html, но если я введу localhost: 3000/index.html, то выражайте рендеринг правильно. Я решил удалить эту строку из app.js:

//app.get('/', routes.index);

Надеюсь, это поможет. Спасибо, что поделился, Д.

Ответ 6

Здесь компиляция шагов, предложенных ранее, но все в одном, в нумерованных шагах. Это основано на версиях: Yeoman 1.0.4 и Express 3.3.8.

1) Создайте каталог проекта и cd в него

2) Установите angular:

yo angular

(вам нужно будет запустить следующие две строки, если вы не вошли в систему как su)

bower install
sudo npm install

3) Переименуйте package.json в пакет package_yo.json(поэтому он не перезаписывается экспресс-версией package.json)

4) Установите Express express -c less -Hs. (или любые другие варианты, которые вы хотите)

sudo npm install

5) Удалить общий каталог "Экспресс" и изменить "общедоступный" на "приложение" для путей в Express "app.js: app.use(require ('less-middleware') ({src: _dirname + '/app'})); app.use(express.static(путь .join(_dirname, 'приложение)));

6) Удалить экспресс-маршрут по умолчанию (app.get('/', routes.index);) (теперь экспресс будет использовать маршруты, указанные в папке angular/app вместо

7) Запустите сервер npm start

(Затем вы должны увидеть страницу приветствия Йомена по адресу: localhost: 3000/)