I'm learning Prisma ORM from video tutorials and official docs. They are explain and write All model code in one file called schema.prisma. It's ok but, when application grow it became messy. So, how should I separate my Model definition into separate file?
At this point in time Prisma doesn't support file segmentation. I can recommend 3 solutions though.
Option 1: Prismix
Prismix utilizes models and enums to create relations across files for your Prisma schema via a prismix configuration file.
{
"mixers": [
{
"input": [
"base.prisma",
"./modules/auth/auth.prisma",
"./modules/posts/posts.prisma",
],
"output": "prisma/schema.prisma"
}
]
}
Placing this inside of a prismix.config.json file which will define how you'd like to merge your Prisma segmentations.
Option 2: Schemix
Schemix Utilizes Typescript configurations to handle schema segmenting.
For example:
// _schema.ts
import { createSchema } from "schemix";
export const PrismaSchema = createSchema({
datasource: {
provider: "postgresql",
url: {
env: "DATABASE_URL"
},
},
generator: {
provider: "prisma-client-js",
},
});
export const UserModel = PrismaSchema.createModel("User");
import "./models/User.model";
PrismaSchema.export("./", "schema");
Inside of User.model
// models/User.model.ts
import { UserModel, PostModel, PostTypeEnum } from "../_schema";
UserModel
.string("id", { id: true, default: { uuid: true } })
.int("registrantNumber", { default: { autoincrement: true } })
.boolean("isBanned", { default: false })
.relation("posts", PostModel, { list: true })
.raw('##map("service_user")');
This will then generate your prisma/schema.prisma containing your full schema. I used only one database as an example (taken from documentation) but you should get the point.
Option 3: Cat -> Generate
Segmenting your schema into chunk part filenames and run:
cat *.part.prisma > schema.prisma
yarn prisma generate
Most of these if not all of them are referenced here in the currently Open issue regarding support for Prisma schema file segmentation https://github.com/prisma/prisma/issues/2377
This is not yet possible with Prisma. See this outstanding issue for possible workarounds https://github.com/prisma/prisma/issues/2377.
There is a library called Prismix that allows you to write as many schema files as you'd like, here you go the link
Related
I had to manually upgrade from 3.2 to 4.2 and because I am developing a Angular library, I could not use the schematics to perform the update.
I have got it working on the development build. We are developing a feature library that targets the checkout (Payment Page and Order Confirmation Page) and it works fine.
With the production build (ng build --configuration production), the payment page works fine, but the Order Confirmation page is not working. it complains that orderCore feature is not configured properly.
Note: we are being redirected from an external site, back to the order confirmation page (after authorization). When the page loads, it shows the following error in the log and show a broken my account page.
core.js:6498 ERROR Error: Feature orderCore is not configured properly
at FacadeFactoryService.getResolver (spartacus-core.js:24825)
at FacadeFactoryService.create (spartacus-core.js:24867)
at facadeFactory (spartacus-core.js:24898)
at orderReturnRequestFacadeFactory (spartacus-order-root.js:13)
at Object.factory (spartacus-order-root.js:37)
at R3Injector.hydrate (core.js:11457)
at R3Injector.get (core.js:11276)
at NgModuleRef$1.get (core.js:25352)
at Object.get (core.js:25066)
at lookupTokenUsingModuleInjector (core.js:3354)
Anyone has an idea if we are missing some configuration in the feature modules?
import { NgModule } from '#angular/core';
import { checkoutTranslationChunksConfig, checkoutTranslations } from '#spartacus/checkout/assets';
import { CHECKOUT_FEATURE, CheckoutRootModule } from '#spartacus/checkout/root';
import { CmsConfig, I18nConfig, provideConfig } from '#spartacus/core';
#NgModule({
declarations: [],
imports: [
CheckoutRootModule,
],
providers: [provideConfig({
featureModules: {
[CHECKOUT_FEATURE]: {
module: () =>
import('#spartacus/checkout').then((m) => m.CheckoutModule),
}
},
} as CmsConfig),
provideConfig({
i18n: {
resources: checkoutTranslations,
chunks: checkoutTranslationChunksConfig,
},
} as I18nConfig)
]
})
export class CheckoutFeatureModule {
}
My colleague has provided a proposal:
If you want to use Spartacus Order library, you need to create "order-feature.module.ts" for it. And by default core is bundled together with components. So, in your configuration, you need have this set: "[ORDER_CORE_FEATURE]: ORDER_FEATURE". So, the config is something like this:
const config: CmsConfig = {
featureModules: {
[ORDER_FEATURE]: {
cmsComponents: [
....
],
},
// by default core is bundled together with components
[ORDER_CORE_FEATURE]: ORDER_FEATURE,
},
};
i define the process.config in vite.config.js such as this
define: {
'process.env': {
publishDate: dayjs().format('YYYY-MM-DD HH:mm:ss'),
version: pkg.version,
title: pkg.title
}
},
in dev mode ,it works,
but in prod mode, the process.config is unfound.
Because you are not doing things as vite documentation suggests:
Type: Record<string, string>
For example, process.env.FOO and __APP_VERSION__ are good fits. But process or global should not be put into this option.
it's implemented as straightforward text replacements without any syntax analysis
The map should be a string to string, not string to object. So you can write:
define: {
'process.env.publishDate': JSON.stringify(dayjs().format('YYYY-MM-DD HH:mm:ss'))
},
My project is currently Vuejs which use BootstrapVue components (seems to use bootstrap 4 css).
I am trying to use Tailwind css for new custom components.
Is it possible to use both of them at same time?
Thank you.
You can solve classes conflict using a prefix
// tailwind.config.js
module.exports = {
prefix: 'tw-',
}
BUT, most likely you will have a problem with normalize.css, which used in #tailwind base
Possible, Yes. Is it recommended, NO.
There are many classes that are gonna contradict with
each other e.g.
.container (Bootstrap)
.container (Tailwind)
.clearfix (B)
.clearfix (T)
And the list goes on...
My advice would be to either stick with BootstrapVue or Tailwind. My personal preference, Tailwind.
Option 1: Adopt or recreate classes
If you only need one or two classes, for example from the color system of Tailwind, you could also copy them.
Some characters would have to be masked, e.g:
// style.css
.hover\:text-blue-900:hover,
.text-blue-900 {
color: #183f6d;
}
That's what I did at the beginning of a project, where bootstrap is the main framework.
If it should be several colors and functions, you can also build this with SCSS quickly. In the long run, however, in my opinion, not the best and cleanest solution.
Example for this:
// style.scss
(...)
#each $name, $hexcode in $tailwind-colors {
.hover\:text-#{$name}:hover,
.text-#{$name} {
color: $hexcode
}
}
}
Full code (Github Gist)
Option 2: Integrate Tailwind
But as soon as more functionalities should be added, or you want to build it cleaner, you can do here with the prefix mentioned by the documentation as Ostap Brehin says.
// tailwind.config.js
module.exports = {
prefix: 'tw-',
}
The normalized definitions can be removed by disabling preflight:
// tailwind.config.js
module.exports = {
corePlugins: {
preflight: false,
}
}
Better check the generated CSS file.
Here is my full tailwind.config.js file:
// tailwind.config.js
module.exports = {
content: [
'./**/*.php',
'../Resources/**/*.{html,js}',
],
safelist: [
'tw-bg-blue-800/75',
{
pattern: /(bg|text)-(blue)-(800)/,
variants: ['hover'],
},
],
prefix: 'tw-',
theme: {
extend: {},
},
corePlugins: {
preflight: false,
},
plugins: [],
}
Yes, you can use Tailwind and Bootstrap together.
However, you need to do some configuration to your tailwind. The first thing is to add a prefix and then turn off the preflight. And if you are not using Tailwind JIT then also make the important as true. If you are using Tailwind JIT then you can use "!" before the class to make it important. For example "!tw-block".
Here is a suitable configuration for Tailwind JIT/CDN:
<script>
tailwind.config = {
prefix: "tw-",
corePlugins: {
preflight: false,
}
}
</script>
If you are not using CDN, use this configuration:
module.exports = {
content: ["./**/*.html"],
prefix: "tw-",
important: true,
corePlugins: {
preflight: false,
}
}
I have written a whole blog on it: https://developerwings.com/tailwind-and-bootstrap-together/
As long as there's no name collision in 2 libs (which I don't think they are), they will work just fine.
But I don't think you should. Because it will break the unification of the project and will make it harder to maintain.
I created a new dummy app with react-native init test, and then followed the instructions to add typeorm. In my App.js I included import {getManager} from 'typeorm', and then ran react-native run-ios.
I see the following error in metro-bundler:
Error: Unable to resolve module path from /Users/amit/Code/test/node_modules/typeorm/platform/PlatformTools.js: Module path does not exist in the Haste module map
Here's a sample repository to show the problem: enter link description here
Not sure if I missed something in the setup! Any help is really welcome!
Unfortunately import from 'typeorm' module does not work because react-native projects does not use node platform excatly. Imports from 'typeorm/browser' will work. Here is a sample project.: https://github.com/typeorm/react-native-example
Make sure you create a connection object that does not use any references to project file system. Avoid using something like:
import { CountSession } from '../biopro-mobile-database/entities/count_session';
const connection = await createConnection({
name: 'liteDb_3',
type: 'react-native',
database: 'biopro_mobile.sqlite',
location: 'default',
synchronize: false,
logging: true,
entities: ["../biopro-mobile-database/entities/**/*.ts"],
})
Avoid entities: ["../biopro-mobile-database/entities//*.ts"],**
Instead use something like:
import { EquipmentCounted } from '../biopro-mobile-database/entities/equipment_counted';
import { CountSession } from '../biopro-mobile-database/entities/count_session';
const connection = await createConnection({
name: 'liteDb_3',
type: 'react-native',
database: 'biopro_mobile.sqlite',
location: 'default',
synchronize: false,
logging: true,
entities: [
CountSession,
EquipmentCounted,
],
})
I develop an iPad/iPhone App web app. Both share some of the resources. Now I wanna build a bootstrap js that looks like this:
requirejs(['app'], function(app) {
app.start();
});
The app resource should be ipadApp.js or iphoneApp.js. So I create the following build file for the optimizer:
{
"appDir": "../develop",
"baseUrl": "./javascripts",
"dir": "../public",
"modules": [
{
"name": "bootstrap",
"out": "bootstrap-ipad.js",
"override": {
"paths": {
"app": "ipadApp"
}
}
},
{
"name": "bootstrap",
"out": "bootstrap-iphone.js",
"override": {
"paths": {
"app": "iphoneApp"
}
}
}
]
}
But this doesn't seems to work. It works with just one module but not with the same module with different outputs.
The only other solution that came in my mind was 4 build files which seems a bit odd. So is there a solution where i only need one build file?
AFAIK the r.js optimizer can only output a module with a given name once - in your case you are attempting to generate the module named bootstrap twice. The author of require.js, #jrburke made the following comment on a related issue here:
...right now you would need to generate a separate build command for each script being targeted, since the name property would always be "almond.js" for each one.
He also suggests:
...if you wanted just one build file to run, you could create a node program and drive the optimizer multiple times in one script file. This example shows using requirejs as a module and calling requirejs.optimize().
I took a similar approach in one of my projects - I made my build.js file an ERB template and created a Thor task that ran through my modules and ran r.js once for each one. But #jrburke's solution using node.js is cleaner.