@abi-software/mapintegratedvuer 中文文档教程

发布于 3年前 浏览 26 更新于 3年前

mapintegratedvuer

该项目旨在提供一个应用程序来可视化地导航解剖实体以发现功能和生理数据集 来自器官特异性神经回路。

mapintegratedvuer on NPM

mapintegratedvuer 在 npm 上可用,可以使用以下命令安装到您的项目中:

npm i @abi-software/mapintegratedvuer

Project setup

npm install

Compiles and minifies for production

npm run build-bundle

How to use

使用以下命令“npm i @abi-software/mapintegratedvuer”在您的 vue 应用程序项目中安装包。 按如下方式在脚本中导入包:

import '@abi-software/mapintegratedvuer';
import '@abi-software/mapintegratedvuer/dist/mapintegratedvuer.css';

上面的代码在全局范围内注册了 MapContent 组件。 您现在可以在 vue 模板中使用 MapContent,如下所示:

<MapContent />

Project setup from Github

源代码可从 Github 获得,可以在此处找到:https://github.com/ABI-Software/mapintegratedvuer。

Clone the respositroy

git clone https://github.com/ABI-Software/mapintegratedvuer

Setup

npm install

Create an instance

npm run serve

Compiles and minifies for production

npm run build-bundle

Example

以下页面演示了 mapintegratedapp 的实际应用:https://mapcore-demo.org/current/sparc-app/maps

Testing mapintegratedvuer dependencies in sparc-app

我们将介绍更新嵌套依赖项的三个选项。

1. Copy build files from npm run build-bundle

这通过直接更改 node-modules/ 中的文件来实现,节点将在其中查找解决依赖关系。

cd <your-dependency>
npm run build-bundle 
cp /dist <mapintegratedvuer-path>/node_modules/@<your-npmhandle>/<your-dependency>/dist
cd <mapintegratedvuer-path>
npm run build-bundle
cp /dist <sparc-app-path>/node_modules/@abi-software/mapintegratedvuer/dist
yarn dev

注意:这假设 npm 包随附的静态文件夹中的资产将保持不变

这是选项 1 的变体,我们使用 yarn link 从中创建符号链接mapintegratedvuer->spar-app 它将副本数减少到 1,但仍然需要 3 次构建

cd <your-dependency>
npm run build-bundle 
cp /dist <mapintegratedvuer-path>/node_modules/@<your-npmhandle>/<your-dependency>/dist
cd <mapintegratedvuer-path>
npm run build-bundle
yarn link
cd sparc-app
yarn link @abi-software/mapintegratedvuer
yarn dev

(npm 链接在不禁用 es-lint 的情况下不起作用,我们不会讨论)

3. Publish own version of mapintegratedvuer

这种方法是最耗时的并且具有填充 npm 包的缺点版本历史与构建。 因为它模仿了 sparc-app 的使用方式,所以它可以正常工作。

cd <your-dependency>
npm run build-bundle
npm publish --tag alpha 
cd mapintegratedvuer
npm install @<your-npmhandle>/<your-dependency>@alpha

编辑 mapintegratedvuer/package.json: 将 @abi-software/mapintegratedvuer 更改为 @/mapintegratedvuer

cd mapintegratedvuer
npm run build-bundle
npm publish --tag alpha 

编辑 sparc-app/pages/maps/index.vue 将 @abi-software/mapintegratedvuer 更改为 @/mapintegratedvuer

cd sparc-app
yarn add @<your-npm-handle>/mapintegratedvuer@alpha
yarn dev

mapintegratedvuer

This project aims to provide an application to visually navigate anatomical entities to discover functional and physiological datasets from organ-specific neural circuitry.

mapintegratedvuer on NPM

mapintegratedvuer is available on npm and can be installed into your project with the following command:

npm i @abi-software/mapintegratedvuer

Project setup

npm install

Compiles and minifies for production

npm run build-bundle

How to use

Install the package in your vue app project with the following command "npm i @abi-software/mapintegratedvuer". Import the package in your script as followed:

import '@abi-software/mapintegratedvuer';
import '@abi-software/mapintegratedvuer/dist/mapintegratedvuer.css';

The codes above register the MapContent component in the global scope. You can now use the MapContent in your vue template as followed:

<MapContent />

Project setup from Github

The source code is available from Github, it can be found here: https://github.com/ABI-Software/mapintegratedvuer .

Clone the respositroy

git clone https://github.com/ABI-Software/mapintegratedvuer

Setup

npm install

Create an instance

npm run serve

Compiles and minifies for production

npm run build-bundle

Example

The following pagedemonstrates the mapintegratedapp in action: https://mapcore-demo.org/current/sparc-app/maps

Testing mapintegratedvuer dependencies in sparc-app

We will cover three options for updating nested dependencies.

1. Copy build files from npm run build-bundle

This works by directly changing files in node-modules/, where node will look to resolve dependencies.

cd <your-dependency>
npm run build-bundle 
cp /dist <mapintegratedvuer-path>/node_modules/@<your-npmhandle>/<your-dependency>/dist
cd <mapintegratedvuer-path>
npm run build-bundle
cp /dist <sparc-app-path>/node_modules/@abi-software/mapintegratedvuer/dist
yarn dev

Note: this assumes assets in the static folders shipped with the npm package will remain unchanged

This is a variant of option 1, where we use yarn link to create a symbolic link from mapintegratedvuer->spar-app It reduces the number of copies to 1, but still requires 3 builds

cd <your-dependency>
npm run build-bundle 
cp /dist <mapintegratedvuer-path>/node_modules/@<your-npmhandle>/<your-dependency>/dist
cd <mapintegratedvuer-path>
npm run build-bundle
yarn link
cd sparc-app
yarn link @abi-software/mapintegratedvuer
yarn dev

(npm link does not work without disabling es-lint, which we won't go into)

3. Publish own version of mapintegratedvuer

This method is the most time consuming and has the downside of populating the npm package's version history with builds. Since it mimics the way sparc-app will use it, it's gauranteed to work.

cd <your-dependency>
npm run build-bundle
npm publish --tag alpha 
cd mapintegratedvuer
npm install @<your-npmhandle>/<your-dependency>@alpha

Edit mapintegratedvuer/package.json: Change @abi-software/mapintegratedvuer to @<your-npm-handle>/mapintegratedvuer

cd mapintegratedvuer
npm run build-bundle
npm publish --tag alpha 

Edit sparc-app/pages/maps/index.vue Change @abi-software/mapintegratedvuer to @<your-npm-handle>/mapintegratedvuer

cd sparc-app
yarn add @<your-npm-handle>/mapintegratedvuer@alpha
yarn dev
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文