Src папка что это
Ещё один пост о сборке front-end проекта
Я потратил прилично времени на структуризацию и автоматизацию сборки фронта. Задача это интересная и стоит того, чтобы о ней рассказать.
Вступительное
Чтобы было удобней следить за мыслью, сразу кидаю ссылку на репозиторий с шаблоном проекта: github.com/alexfedoseev/js-app-starter
Убедитесь, что установлен npm.
Установите необходимые глобальные модули (если ещё не установлены):
Сделайте форк репозитория.
Установите зависимости проекта (исполнять в корне репозитория):
Соберите проект в development окружении и запустите локальный сервер:
Откройте браузер и перейдите на lvh.me:3500
Структура проекта
.gitignore & .npmignore
Внутри этих файлов находится список того, что будет игнорироваться git и npm при коммитах/паблишах.
node_modules/
В эту директорию падают все модули, которые мы установим через npm.
npm-shrinkwrap.json
Я не держу в репозитории содержимое node_modules/. Вместо этого лочу все зависимости через этот файл. Он генерируется автоматически командой: `npm shrinkwrap`.
package.json
Это файл с глобальными настройками проекта. К нему ещё вернемся.
gulpfile.js
Обычно тут хранятся все таски для сборки проекта, но в нашем случае он просто определяет значение переменной окружения и пробрасывает нас дальше в папку с gulp-тасками.
lib/gulp/
Здесь храним все настройки и задачи сборщика.
|— config.js
Выносим настройки для всех тасков в отдельный файл, чтобы минимизировать правку самих тасков.
|— helpers/
Вспомогательные методы сборщика.
|— tasks/
И сами gulp-таски.
src/
Исходники проекта.
public/
Результат сборки. Абсолютно всё содержимое этой папки генерируется сборщиком и перед каждой новой сборкой она полностью очищается, поэтому тут никогда и ничего не храним.
dist/
Иногда я пишу opensource-модули. В этой папке после сборки оказываются обычная и минифицированная версии написанной js-библиотеки. При этом директория public/ используется как хранилище для демки. Если вы делаете обычный сайт или страницу приземления, то оно не понадобится.
Настройка проекта
package.json
Это файл, в котором хранятся глобальные настройки проекта.
Подробное описание его внутренностей можно посмотреть тут: browsenpm.org/package.json
Ниже я остановлюсь только на некоторых важных частях.
Консольные команды
В package.json мы можем прописать алиасы для консольных команд, которые будем часто выполнять в процессе разработки.
Production сборка
Когда мы готовы релизить проект — делаем production-сборку.
Переходим к Gulp. Структура тасков взята из сборщика от Dan Tello.
Перед тем, как нырнуть, небольшой комментарий по порядку выполнения обычного gulp-таска:
Теперь разберемся что и в каком порядке будем собирать.
Development сборка
`npm start` запускает команду `gulp`. Что происходит дальше:
Production сборка
С ней всё проще. `npm run build` запускает команду `gulp build`, которая очищает целевые папки, линтит js-код, собирает спрайты и после этого собирет проект (без sourcemaps). Код с комментариями выше.
Файл конфигураций gulp-тасков
Все основные конфигурации тасков вынесены в отдельный файл lib/gulp/config.js:
Сборка HTML
Для шаблонизации используем Jade. Он позволяет делать вставки партиалов, использовать inline-javascript, переменные, миксины и ещё много разных крутых штук.
Структура папки src/html
Все партиалы снабжаем префиксом `_` (нижнее подчеркивание), чтобы при сборке мы могли их отфильтровать и игнорировать.
helpers/_variables.jade
Сохраняем необходимые параметры в переменные. Например, если у нас телефон стоит в нескольких местах страницы, то его лучше сохранить в переменную и в шаблонах использовать именно её.
helpers/_mixins.jade
Часто используемые блоки можно обернуть в mixin.
index.jade
Скелет главной страницы.
meta/_head.jade
Содержимое head.
Сборка JavaScript
В качестве модульной системы используем Browserify. C ним мы можем использовать стиль подключения CommonJS модулей непосредственно в браузере. Кроме этого мы теперь можем использовать ES6-синтаксис: Babel преобразует его в ES5 перед тем, как Browserify соберет js. И перед сборкой мы проходимся jsHint для проверки качества кода.
У Browserify есть один минус: если вы пишете библиотеку с внешними зависимостями (например jQuery-плагин), то он не сможет сделать правильную UMD-обертку. В этом случае я заменяю Browserify на конкатенацию и пишу обёртку руками.
На проекте может возникнуть необходимость формировать несколько наборов js/css.
Например вы пишите фронт + админку. Или библиотеку в 2 вариантах: без зависимостей и в формате jQuery-плагина. Эти сборки нужно разделять. Для этого в настройках сборщика мы создаем массив:
js/css cборщики будут искать в папке с js/css исходниками соответствующий end-point файл (`app.js` или `app.styl`). Через этот end-point файл мы управляем всеми зависимостями бандла. Их структуру я покажу чуть ниже.
Перед передачей бандлов сборщику, мы предварительно пропускаем массив через хелпер `bundler`, который формирует объект с настройками.
Структура папки src/js
app.js
Через этот файл мы рулим всеми зависимостями и порядком исполнения js-компонентов. Имя файла должно совпадать с именем бандла.
В таких случаях используем browserify-shim: плагин, который позволяет превращать обычные библиотеки в CommonJS-совместимые модули. Итак, у нас есть jQuery-плагин `maskedinput`, которого нет в npm.
Добавляем в `package.json` преобразование и выставляем настройки для зависимости:
После этого мы можем подключать модуль:
Сборка CSS
В качестве препроцессора используем Stylus. Плюс проходимся по css автопрефиксером, чтобы не прописывать вендорные префиксы руками.
Структура папки src/css
app.styl
Через этот файл мы рулим порядком подключения css-компонентов. Имя файла должно совпадать с именем бандла.
Все остальные таски — картинки, спрайты, очистка и пр. — не требуют дополнительных комментариев (на самом деле я просто устал уже строчить). Исходники лежат в репозитории: github.com/alexfedoseev/js-app-starter
Если есть косяки или дополнения — буду рад обратной связи через комментарии тут или issues / pull requests на Github. Удач!
src / структура папок на C++?
Я прихожу в C++ из Java / AS3-land, и я привык к структуре пакетов и папок для своих классов. и мне это нравится.
Я понимаю самые основы пространств имен в c++, и я рад оставить его только в основах. но, поскольку мой проект становится все сложнее, я бы хотел, чтобы структура папок была организована так, чтобы я мог держать ее в голове. т. е. что-то похожее на Java/AS3.
1) Есть ли основания не иметь структуру папок например:
возможно с подпапками? (это просто пример в MVC структура папок может быть любой в зависимости от потребностей проекта.) просто кажется неуправляемым иметь src / папку с огромной кучей заголовочных и исходных файлов внутри.
2) если ответ на 1) может быть «идти вперед и делать то, что вы хотите», было бы неразумно/ненужно создавать пространство имен для каждой папки, подобно способу Java/AS3 создания пакета для каждой папки? в моем понимании эти пространства имен обычно не используются так, вложенные глубоко и связанные с папками.
6 ответов
Мне всегда нравилось пространство имен для каждой папки. В основном потому, что когда я должен поддерживать чей-то код, пространство имен помогает мне найти, где класс был первоначально определен.
хорошо названные файлы заголовков также могут помочь с этим. Я также не предложил бы идти больше, чем 2-3 пространства имен, так как тогда это просто становится неприятным. Вы обнаружите, что используете «использование пространства имен blah;» много, что я всегда нахожу красным флагом для кода C++. И вы не можете использовать «using namespace» внутри файла заголовка без каких-либо серьезных проблем.
Это все совершенно необязательно, хотя в C++.
каждому пакету разрешено только #включать заголовки верхнего уровня другого пакета, никогда не в src/ справочники.
(и, конечно, фактические имена файлов не выглядят так глупо, как показано выше.)
src / является общим местом, где программисты c / C++ помещают свои источники в корень проекта. Например:
обычно создаются подкаталоги под src/, если у вас много исходных файлов, но нет ограничений на организацию этой подструктуры.
имейте в виду, что структура каталогов полностью необязательна в c++. Это не связь между пространствами имен c++ и структурой каталогов.
нет причин не разделять исходный код на разные каталоги; это имеет смысл, если есть много файлов и четкие логические группировки.
нет необходимости создавать отдельный файл для каждого небольшого класса, хотя-в больших проектах, что, как правило, замедляет компиляцию (поскольку файлы реализации часто должны включать много одинаковых заголовков, чтобы скомпилировать их пару десятков строк).
а также использование пространств имен для отражения логической деления в коде, точные пороговые значения, при которых код подразделяется на дальнейшие пространства имен, как правило, управляются некоторыми другими силами, например:
нет причин не делать этого и действительно поможет людям, читающим ваш код. Некоторые вещи, чтобы следить за:
вы можете организовать ваши файлы, как вам нравится; вам просто нужно настроить инструменты сборки » включают пути и исходные пути для соответствия.
предоставление каждому каталогу собственного пространства имен является излишним и, вероятно, плохой идеей, поскольку это приведет к путанице кода. Я бы рекомендовал не более одного пространства имен для каждого проекта или даже только одно пространство имен для каждой компании (поскольку, предположительно, в вашей компании у вас есть возможность переименовывать вещи, если это необходимо для разрешения конфликтов имен. Основные пространства имен цель состоит в том, чтобы обработать случай, когда две кодовые базы под управлением двух разных организаций используют одно и то же имя, и вы как третья сторона хотите использовать их в одном проекте, но не имеете возможности изменить ни одну кодовую базу).
Проекты в Java
1. Пакеты
В стандартных Java-программах очень много классов. Сколько? Тысячи, десятки тысяч. А если еще посчитать, что программа использует различные библиотеки, которые содержат классы, написанные другими программистами, то количество классов легко может исчисляться миллионами!
Для всех этих миллионов, да и просто тысяч классов невозможно придумать уникальные имена.
Поэтому в Java все классы сгруппированы по пакетам.
Классы и их пакеты в Java по своей сути очень напоминают файлы и папки на компьютере.
Например, если вам нужно хранить на компьютере 10 документов, вы скорее всего просто будете хранить их в одной папке. А если документов тысячи (например, хранилище всех документов компании)?
Если бы нужно было хранить тысячи документов, решением было бы разработать несколько уровней папок с хорошими говорящими названиями. И в папке самого последнего уровня хранить документы, которые относятся к этой конкретной папке. Хорошие говорящие названия для документов тоже не помешают.
Фактически в Java это все и было сделано для классов.
Файлы с классами хранятся в разных директориях (папках), и полное название папки класса со всеми подпапками называется пакетом класса. Пример:
Путь к файлу | Имя пакета | Имя класса |
---|
2. Папка src
В Java принято все классы одной программы хранить в одной папке (и ее подпапках). Такую папку обычно называют src (сокращение от source ).
Такая папка называется корнем проекта ( source root ), и все пути для пакетов считаются от нее. Примеры:
В Java принято давать классам и пакетам осмысленные имена. Многие компании выпускают свои библиотеки (набор классов) и, чтобы не было путаницы, называют пакеты этих классов по имени компании/сайта/проекта:
Имя пакета | Имя компании/проекта |
---|---|
Проект «Apache» | |
Компания «Oracle» | |
Компания Oracle, проект Java | |
Компания «IBM», проект WebSphere | |
Проект «Jboss» |
3. Содержимое файла
Согласно стандарту языка Java, внутри файла с кодом должна быть записана информация об имени класса и имя его пакета. Схема стандарта приведена ниже:
Имя пакета должно совпадать с именем папки, а имя файла — с именем публичного класса.
4. Импорт классов
Полное уникальное имя | Имя пакета | Имя класса |
---|---|---|
отсутствует |
Хорошая новость:
Полное имя класса всегда уникально в рамках одного проекта. Ну вы же не можете создать два файла с одним и тем же именем в одной и той же папке.
Плохая новость:
Полные имена классов обычно либо длинные, либо очень длинные. А ведь каждый раз писать в коде длинное имя, например java.util.ArrayList, очень неудобно.
Поэтому в Java добавили возможность «импортировать классы».
Чтобы использовать короткое имя класса в своем коде, вам нужно добавить вот такую конструкцию в свой код:
А вот как бы выглядел этот же код, если бы мы не использовали import :
Допустим, у вас в коллективе есть Серега, и никаких проблем с общением, не возникает — все знают кто это. Но если бы их было трое, чтобы их различать, пришлось бы использовать полные уникальные имена.
Кстати, если вам лень добавлять много импортов в ваш класс, вы можете воспользоваться его версией для ленивых: вместо имени класса поставить звездочку:
Таким образом, вы сможете использовать в вашем коде короткие имена всех классов из данного пакета.
Отдельные папки» include «и» src » для кода уровня приложения?
эти вопросы касаются в основном разработки Unix / Linux style c++. Я вижу, что многие C++ библиотеки храните файлы заголовков в папке» include «и исходные файлы в папке» src». Ради соответствия я принял это в своем собственном кодексе. Но мне не ясно, следует ли это делать для приложение код, а также. Я видел несколько случаев, когда для этого используется плоская структура каталогов. Каков будет рекомендуемый подход?
10 ответов
Я также разделяю их, но не строго по расширению, а по доступу к файлу.
Предположим, у вас есть модуль, который управляет информацией о клиентах и использует для этого 2 класса: Customer, CustomerValidityChecker. Также предположим, что другие части приложения должны знать только о классе Customer и что CustomerValidityChecker используется только классом Customer для выполнения некоторой проверки. Основываясь на этих предположениях, я храню файлы, такие как это:
общая папка (или включить папку):
частная папка (или исходная папка):
таким образом, для абонентов вашего модуля сразу становится ясно, какие части доступны (общедоступны), а какие нет.
однако в результате этого нет разделения заголовков и источников. И это никогда не было проблемой. Честно говоря, я думаю, что это лучше, потому что заголовки и исходные файлы имеют общее расположение, и вы можете захватить каталог и знать, что у вас есть все, что вам нужно, чтобы использовать его. Он также отлично работает с функцией Subversion «externals» и аналогичными функциями в других VCSs.
имеет смысл разделить их для общих библиотек, потому что они могут быть распространены в скомпилированной форме без источника. Я видел проекты, которые отделяют «открытые» заголовки (заголовки, которые могут быть доступны из кода за пределами вашего проекта или библиотеки), оставляя «частные» заголовки и исходные файлы в одном каталоге. Я думаю, что хорошо использовать согласованный подход, независимо от того, пишете ли вы общую библиотеку или код уровня приложения, потому что вы никогда не знаете, когда вы захотите включить то что вы написали на уровне приложения в нижней библиотеки, которая совместно используется несколькими проектами.
многое зависит от размера проекта. До нескольких десятков файлов или около того, хранение их в одном каталоге, как правило, более удобно. Для большего приложения, которое включает сотни или тысячи файлов, вы начинаете искать способы их разделения (хотя в проектах, над которыми я работал, это было сделано больше по функциональным линиям, чем src/include). В промежутке между ними, это, вероятно, под вопросом.
Я почти всегда создаю папки include и src для разделения исходного кода. Я думаю, что это делает папку менее загроможденной, и файлы легче найти в моей IDE. Но я думаю, это просто вопрос вкуса.
любой метод является допустимым. Это зависит от стиля кодирования, которому вы хотите следовать, как вы это делаете.
на мой взгляд, нет явного преимущества ни для того, ни для другого. Я, наконец, решил сохранить файлы программы и заголовков вместе, потому что мой редактор (Visual SlickEdit) предоставляет дополнительные ссылочные функции, когда они не разделены.
Я размещаю include (заголовок) и исходные файлы в одном каталоге (папке). Я создаю разные папки для разных тем. Я расстраиваюсь при попытке найти файлы заголовков (во время отладки, а также для исследования). В некоторых магазинах есть только две папки: source и includes. Эти каталоги имеют тенденцию расти экспоненциально. Повторное использование кода становится кошмаром в лучшем случае.
ИМХО, я считаю, что организация по теме лучше. Каждая папка темы должна быть встроена по крайней мере в одна библиотека. Различные проекты могут легко включать темы путем поиска или включения папок. Проекты должны включать только библиотеки. Движки Smart build могут отображать папки тем в качестве зависимостей. Это ускоряет процесс сборки.
организация темы также добавляет немного безопасности в проект. Случайное повреждение файлов (например, удаление неправильных или замена на другие версии) уменьшается, так как файлы находятся в разных каталогах. Удаление файлов в папке » Person «не повлияет на файлы в папке» Shape».
Это только мое мнение, ваш пробег может варьироваться.
У нас есть система сборки, которая использует это правило. Эта система сборки sconspiracy набор скриптов для настройки SCons и посвященный миру C++. Вы можете увидеть пример, который использует эти инструменты:fw4spl
Что означает каталог /dist в проектах с открытым исходным кодом?
С тех пор, как я впервые увидел dist/ каталог во многих проектах с открытым исходным кодом, обычно на GitHub, мне было интересно, что это значит. (Я иностранец, не родной на английском языке)
поправьте меня, если я ошибаюсь!
почему открытый исходный код так запутан? Разве это не возможно сделать все более четко? По крайней мере, для каждого языка, потому что некоторые языки используют определенные имена.
3 ответов:
/dist означает «дистрибутив», скомпилированный код/библиотека.
структура папок зависит от системы сборки и языка программирования. Вот некоторые стандартные соглашения:
Markdown / Текстовые Файлы:
конкретные (они могут продолжаться вечно):
чтобы ответить на ваш первоначальный вопрос о значении :
в краткая форма dist расшифровывается как distributable и относится к каталогу, где будут храниться файлы, которые могут быть непосредственно использованы другими без необходимости компиляции или минимизации исходного кода, который используется повторно.
нечто подобное относится и к модулям JavaScript. Обычно код JavaScript минимизируется и запутывается для использования в производстве. Поэтому, если вы хотите распространять библиотеку JavaScript, рекомендуется поместить простой (не уменьшенный) исходный код в src (исходный) каталог и уменьшенный и запутанная версия в dist (распространяемый) directoy, поэтому другие могут сразу же захватить уменьшенную версию без необходимости ее уменьшать.