const idbConfig = {
version: 1,
dbname: 'stats123',
storages: [
{
name: "constants123",
settings: { }
}
]
};
class Database {
// config
// database <-- Это поля класса
constructor(config) {
this.config = config;
}
init() {
return new Promise((resolve, reject) => {
const openRequest = indexedDB.open(this.config.dbname, this.config.version);
openRequest.onupgradeneeded = (event) => {
// Здесь нельзя перезаписывать this.database, потому что БД будет находиться в режиме незавершенной
// upgrage-транзакции и все равно не позволит ничего в себя сохранить.
const database = openRequest.result;
this.createStorages(database);
}
openRequest.onsuccess = (event) => {
// Перезаписывать this.database надо именно в этом событии, потому что зедсь транзакция обновления уже завершена
// и БД готова к дальнейшей работе.
// Это событие всегда вызывается после onupgradeneeded/
this.database = openRequest.result;
resolve(true);
}
})
}
createStorages(database) {
this.config.storages.forEach(s => {
if (!database.objectStoreNames.contains(s.name)) {
database.createObjectStore(s.name, s.settings);
}
});
}
save(storage, data, key = null) {
return new Promise((resolve, reject) => {
const tx = this.database.transaction(storage, "readwrite");
const st = tx.objectStore(storage);
if (key) {
st.add(data, key);
} else {
st.add(data);
}
resolve(data);
})
}
}
class ConstantsService {
storage = "constants123";
database;
requestConfig;
constructor(database) {
this.database = database;
}
async loadConstants() {
const gameVersion = await this.loadGameVersion();
await this.saveOrUpdateGameVersion(gameVersion);
}
async loadGameVersion() {
return {
id: 132,
name: "pathched",
releaseDate: 1722470400
};
}
async saveOrUpdateGameVersion(gameVersion) {
await this.database.save(this.storage, gameVersion, "gameVersion");
}
}
async function demo() {
const database = new Database(idbConfig);
// Тут надо было дождаться окончания промиса, иначе save вызывалось до того, как this.database успеет перезаписаться
await database.init();
const cs = new ConstantsService(database);
cs.loadConstants();
}
demo();const idbConfig = {
version: 1,
dbname: 'stats123',
storages: [
{
name: "constants123",
settings: { }
}
]
};
class Database {
// config <-- Это поля класса
// database <-- Тут должен храниться объект открытой БД.
constructor(config) {
this.config = config;
this.database = "ololo"; // Просто для наглядности, что поле не перезапишется.
}
init() {
return new Promise((resolve, reject) => {
const openRequest = indexedDB.open(this.config.dbname, this.config.version);
openRequest.onupgradeneeded = (event) => {
this.database = openRequest.result; // a) Здесь предполагалось сохранить объект открытой БД, чтобы не переоткрывать каждый раз.
this.createStorages();
resolve(true);
}
})
}
createStorages() {
this.config.storages.forEach(s => {
if (!this.database.objectStoreNames.contains(s.name)) {
this.database.createObjectStore(s.name, s.settings);
}
});
}
save(storage, data, key = null) {
return new Promise((resolve, reject) => {
const tx = this.database.transaction(storage, "readwrite"); // b) Ошибка вываливается тут, из-за this.database = "ololo", т.е. как будто не перезаписалось.
const st = tx.objectStore(storage);
if (key) {
st.add(data, key);
} else {
st.add(data);
}
resolve(data);
})
}
}
class ConstantsService {
storage = "constants";
database; // <-- Это поле не под саму БД indexeddb, а под экземпляр класса Database.
requestConfig;
constructor(database) {
this.database = database;
}
async loadConstants() {
const gameVersion = await this.loadGameVersion();
await this.saveOrUpdateGameVersion(gameVersion);
}
async loadGameVersion() {
return {
id: 132,
name: "pathched",
releaseDate: 1722470400
};
}
async saveOrUpdateGameVersion(gameVersion) {
await this.database.save(this.storage, gameVersion, "gameVersion");
}
}
const database = new Database(idbConfig);
database.init();
const cs = new ConstantsService(database);
cs.loadConstants();const path = require('path');
module.exports = (settings) => {
console.log("Hello, world!");
сonsole.log(settings.mode);
return {
mode: settings.mode,
entry: './src/index.js',
output: {
filename: 'main.js',
path: path.resolve(__dirname, 'dist'),
clean: true
}
}
};{
"name": "mywebpack",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "webpack"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^5.93.0",
"webpack-cli": "^5.1.4"
}
}npm run build --env mode=production[webpack-cli] Unknown command or entry 'mode=production'
[webpack-cli]
Run 'webpack --help' to see available commands and optionsну с npm всё возможно. Он же попробует сплющить дерево и Foobar попадёт в область видимости приложения. Это прямо-таки стандартная ошибка новичков и не только.
но поскольку в реальности Plug2 явно не вызывает Foobar, то в итоге он будет работать с Foobar@1 из верхнего уровня и привет два часа счастливого дебага.. Как в итоге такую проблему обычно решают?
Библиотека плагином тоже не пользуется, ей от его существования ни горячо, ни холодно. Соответственно, у Foobar никаких зависимостей нет, у Plug зависимостей тоже нет, но в peer-зависимостях указано, что те, кто хочет Plug установить к себе в качестве зависимости, должны установить рядом с ним и Foobar тоже., я представить не могу.
но поскольку в реальности Plug2 явно не вызывает Foobar, то в итоге он будет работать с Foobar@1 из верхнего уровня и привет два часа счастливого дебага.
1) Использовать гриды для создания сетки - это нормально? Просто помню, что когда-то давно считалось, что использовать таблицы для верстки - это моветон. А гриды вроде как преемник таблицы. Удобен для отображения товаров в виде колонок-строк, а вот именно для верстки самой сетки страницы я пока не встречал гриды.
2) Как поступать в случае адаптивности? Например, если в моем примере с флексами мне надо скрыть боковое меню, я просто ставлю `display: none` и оно исчезает, а блок контента безо всяких дополнений просто растягивается по всей ширине. В случае с гридом же блок контента становится урезанным по горизонтали.