Merge branch 'main' into aggregation

This commit is contained in:
rijkvanzanten
2021-06-28 19:18:53 -04:00
73 changed files with 26773 additions and 22322 deletions

View File

@@ -1,4 +1,4 @@
const path = require('path');
const path = require('path/posix');
const fse = require('fs-extra');
const dirTree = require('directory-tree');

View File

@@ -19,8 +19,12 @@ If you're experiencing issues or think you have found a problem in Directus, be
8. Check for [existing Issues](https://github.com/directus/directus/issues?q=is%3Aissue) (and
[Discussions](https://github.com/directus/directus/discussions)) that match your problem
::: tip Source Contributors Those who have installed from source should also remove all dependencies
(`npx lerna clean -y`) and then reinstall them (`npm install`). :::
::: tip Source Contributors
Those who have installed from source should also remove all dependencies (`npx lerna clean -y`) and then reinstall them
(`npm install`).
:::
If you're still experiencing a problem after completing the above steps, you can chat through things on our
[community support](#community-support) or [report a bug](/contributing/introduction/#bug-reporting).

View File

@@ -86,7 +86,7 @@ export default {
};
```
## 2. Install Dependencies and Configure the Buildchain
## 2. Install Dependencies
Set up a package.json file by running:
@@ -95,38 +95,14 @@ npm init -y
```
To be read by the Admin App, your custom display's Vue component must first be bundled into a single `index.js` file. We
recommend bundling your code using Rollup. To install this and the other development dependencies, run this command:
recommend bundling your code using the directus-extension CLI from our `@directus/extension-sdk` package. The CLI
internally uses a Rollup configuration tailored specifically to bundling Directus extensions. To install the Extension
SDK, run this command:
```bash
npm i -D rollup @rollup/plugin-node-resolve @rollup/plugin-commonjs rollup-plugin-terser rollup-plugin-vue @vue/compiler-sfc
npm i -D @directus/extension-sdk
```
You can then use the following Rollup configuration within `rollup.config.js`:
```js
import { nodeResolve } from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import { terser } from 'rollup-plugin-terser';
import vue from 'rollup-plugin-vue';
export default {
input: 'src/index.js',
output: {
format: 'es',
file: 'dist/index.js',
},
external: ['vue', '@directus/extension-sdk'],
plugins: [vue(), nodeResolve(), commonjs(), terser()],
};
```
::: tip Building multiple extensions
You can export an array of build configurations, so you can bundle (or even watch) multiple extensions at the same time.
See the [Rollup configuration file documentation](https://rollupjs.org/guide/en/#configuration-files) for more info.
:::
## 3. Develop Your Custom Display
The display itself is simply a function or a Vue component, providing a blank canvas for creating anything you need.
@@ -136,7 +112,7 @@ The display itself is simply a function or a Vue component, providing a blank ca
To build the display for use within Directus, run:
```bash
npx rollup -c
npx directus-extension build
```
Finally, move the output from your display's `dist` folder into your project's `/extensions/displays/my-custom-display`

View File

@@ -77,7 +77,7 @@ export default {
- `field` — The key of the field.
- `primaryKey` — The current item's primary key.
## 2. Install Dependencies and Configure the Buildchain
## 2. Install Dependencies
Set up a package.json file by running:
@@ -86,38 +86,14 @@ npm init -y
```
To be read by the Admin App, your custom interface's Vue component must first be bundled into a single `index.js` file.
We recommend bundling your code using Rollup. To install this and the other development dependencies, run this command:
We recommend bundling your code using the directus-extension CLI from our `@directus/extension-sdk` package. The CLI
internally uses a Rollup configuration tailored specifically to bundling Directus extensions. To install the Extension
SDK, run this command:
```bash
npm i -D rollup @rollup/plugin-node-resolve @rollup/plugin-commonjs rollup-plugin-terser rollup-plugin-vue @vue/compiler-sfc
npm i -D @directus/extension-sdk
```
You can then use the following Rollup configuration within `rollup.config.js`:
```js
import { nodeResolve } from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import { terser } from 'rollup-plugin-terser';
import vue from 'rollup-plugin-vue';
export default {
input: 'src/index.js',
output: {
format: 'es',
file: 'dist/index.js',
},
external: ['vue', '@directus/extension-sdk'],
plugins: [vue(), nodeResolve(), commonjs(), terser()],
};
```
::: tip Building multiple extensions
You can export an array of build configurations, so you can bundle (or even watch) multiple extensions at the same time.
See the [Rollup configuration file documentation](https://rollupjs.org/guide/en/#configuration-files) for more info.
:::
## 3. Develop your Custom Interface
The interface itself is simply a Vue component, which provides an blank canvas for creating anything you need.
@@ -127,7 +103,7 @@ The interface itself is simply a Vue component, which provides an blank canvas f
To build the interface for use within Directus, run:
```bash
npx rollup -c
npx directus-extension build
```
Finally, move the output from your interface's `dist` folder into your project's

View File

@@ -82,7 +82,7 @@ The props you can use in an layout are:
- `filters` (sync) - The user's currently active filters.
- `search-query` (sync) - The user's current search query.
## 2. Install Dependencies and Configure the Buildchain
## 2. Install Dependencies
Set up a package.json file by running:
@@ -91,38 +91,14 @@ npm init -y
```
To be read by the Admin App, your custom layouts's Vue component must first be bundled into a single `index.js` file. We
recommend bundling your code using Rollup. To install this and the other development dependencies, run this command:
recommend bundling your code using the directus-extension CLI from our `@directus/extension-sdk` package. The CLI
internally uses a Rollup configuration tailored specifically to bundling Directus extensions. To install the Extension
SDK, run this command:
```bash
npm i -D rollup @rollup/plugin-node-resolve @rollup/plugin-commonjs rollup-plugin-terser rollup-plugin-vue @vue/compiler-sfc
npm i -D @directus/extension-sdk
```
You can then use the following Rollup configuration within `rollup.config.js`:
```js
import { nodeResolve } from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import { terser } from 'rollup-plugin-terser';
import vue from 'rollup-plugin-vue';
export default {
input: 'src/index.js',
output: {
format: 'es',
file: 'dist/index.js',
},
external: ['vue', '@directus/extension-sdk'],
plugins: [vue(), nodeResolve(), commonjs(), terser()],
};
```
::: tip Building multiple extensions
You can export an array of build configurations, so you can bundle (or even watch) multiple extensions at the same time.
See the [Rollup configuration file documentation](https://rollupjs.org/guide/en/#configuration-files) for more info.
:::
## 3. Develop Your Custom Layout
The layout itself is simply a Vue component, which provides an blank canvas for creating anything you need.
@@ -132,7 +108,7 @@ The layout itself is simply a Vue component, which provides an blank canvas for
To build the layout for use within Directus, run:
```bash
npx rollup -c
npx directus-extension build
```
Finally, move the output from your layout's `dist` folder into your project's `/extensions/layouts/my-custom-layout`

View File

@@ -119,7 +119,7 @@ instance of the `collectionsStore` using `system.useCollectionsStore()`, but tha
If you setup a route with a parameter, you can pass it in as a prop.
## 2. Install Dependencies and Configure the Buildchain
## 2. Install Dependencies
Set up a package.json file by running:
@@ -128,38 +128,14 @@ npm init -y
```
To be read by the Admin App, your custom module's Vue component must first be bundled into a single `index.js` file. We
recommend bundling your code using Rollup. To install this and the other development dependencies, run this command:
recommend bundling your code using the directus-extension CLI from our `@directus/extension-sdk` package. The CLI
internally uses a Rollup configuration tailored specifically to bundling Directus extensions. To install the Extension
SDK, run this command:
```bash
npm i -D rollup @rollup/plugin-node-resolve @rollup/plugin-commonjs rollup-plugin-terser rollup-plugin-vue @vue/compiler-sfc
npm i -D @directus/extension-sdk
```
You can then use the following Rollup configuration within `rollup.config.js`:
```js
import { nodeResolve } from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import { terser } from 'rollup-plugin-terser';
import vue from 'rollup-plugin-vue';
export default {
input: 'src/index.js',
output: {
format: 'es',
file: 'dist/index.js',
},
external: ['vue', '@directus/extension-sdk'],
plugins: [vue(), nodeResolve(), commonjs(), terser()],
};
```
::: tip Building multiple extensions
You can export an array of build configurations, so you can bundle (or even watch) multiple extensions at the same time.
See the [Rollup configuration file documentation](https://rollupjs.org/guide/en/#configuration-files) for more info.
:::
## 3. Develop Your Custom Module
The module itself is simply a Vue component, which provides an blank canvas for creating anything you need.
@@ -169,7 +145,7 @@ The module itself is simply a Vue component, which provides an blank canvas for
To build the module for use within Directus, run:
```bash
npx rollup -c
npx directus-extension build
```
Finally, move the output from your module's `dist` folder into your project's `/extensions/modules/my-custom-module`

View File

@@ -1,7 +1,7 @@
{
"name": "@directus/docs",
"private": false,
"version": "9.0.0-rc.80",
"version": "9.0.0-rc.81",
"description": "",
"main": "dist/index.js",
"scripts": {

View File

@@ -151,6 +151,30 @@ directus.transport.url = 'https://api2.example.com';
You can tap into the transport through `directus.transport`. If you are using the (default) `AxiosTransport`, you can
access axios through `directus.transport.axios`.
#### Intercepting requests and responses
Axios transport offers a wrapper around Axios interceptors to make it easy for you to inject/eject interceptors.
```ts
const requestInterceptor = directus.transport.requests.intercept((config) => {
config.headers['My-Custom-Header'] = 'Header value';
return config;
});
// If you don't want the interceptor anymore, remove it
requestInterceptor.eject();
```
```ts
const responseInterceptor = directus.transport.responses.intercept((response) => {
console.log('Response received', { response });
return response;
});
// If you don't want the interceptor anymore, remove it
responseInterceptor.eject();
```
## Items
You can get an instance of the item handler by providing the collection (and type, in the case of TypeScript) to the