Skip to main content

Install SDK

Download SDK

https://compass-framework/download/sdk/compass-framework@1.0.0.zip

Import type file

package.json

{
"devDependencies": {
"compass-library":"1.0.0",
"compass-core": "1.0.0",
"compass-tools": "1.0.0"
}
}

Browser Install

Unzip and Import SDK file

index.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<script src="./sdk/compass-framework/compass-library/compass-library.js"></script>
<script src="./sdk/compass-framework/compass-core/compass-core.js"></script>
</head>
<body>
<div id="container"></div>
</body>
</html>

If you use the packaging tool, you need to set the compass-core and compass-library as external extensions(When using webpack here)

webpack.config.js

module.exports = {
entry: {
'index': resolve("src/index.ts"),
},
module: {
rules: [
{
test: /\.tsx?$/,
type: "javascript/auto",
use: {
loader: 'ts-loader'
},
},
{
test: /\.(xml|text|txt)$/,
type: "javascript/auto",
use: {
loader: 'raw-loader'
},
},
{
test: /\.(png|svg|jpe?g|gif)$/i,
type: "javascript/auto",
use: {
loader: 'url-loader',
options: {
outputPath: 'img',
limit: 0,
name: '[name].[ext]?[hash]',
esModule: false,
},
},
}
],
},
mode: 'development',
devtool: 'inline-source-map',
plugins: [
new HtmlWebpackPlugin({
template: './index.html',
title: 'example',
scriptLoading: 'blocking',
}),
],
// set the compass-core and compass-library
// as external extensions
externals: {
'compass-library': 'compass-library',
'compass-core': 'compass-core',
},
output:{
filename: 'js/[name].[contenthash].js',
library: 'example',
libraryTarget: 'umd',
},
devServer: {
host: '127.0.0.1',
port: 'auto',
static: './',
hot: true,
bonjour: true,
client: {
progress: true,
overlay: true,
},
}
}

NodeJS Install

install soft render backend;

npm i canvas;
npm i skia-canvas;

Unzip and Import SDK file

Find compass-core and compass-library from node_modules

2023-06-18.png

Copy directories and files from the compass-core and compass-library sdk to node_modules compass-core and compass-library directories

2023-06-18.png

copy to

2023-06-18.png