mxcad-app 1.0.18 → 1.0.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,253 +1,253 @@
1
- # mxcad-app
2
-
3
- [![npm version](https://badge.fury.io/js/mxcad-app.svg)](https://badge.fury.io/js/mxcad-app)
4
-
5
- `mxcad-app` 是一个在线 CAD 项目, 用户可以直接集成它。
6
-
7
- ## 🎯 一句话理解
8
- **mxcad-app = 一个开箱即用的在线CAD软件**,集成到你的网页就像搭积木一样简单,3分钟就能让你的网站拥有专业CAD功能。
9
-
10
- ## 📦 安装
11
-
12
- 使用 npm 或 yarn 安装 `mxcad-app`:
13
-
14
- ```bash
15
- npm install mxcad-app --save
16
- ```
17
-
18
- 或者
19
-
20
- ```bash
21
- yarn add mxcad-app
22
- ```
23
-
24
- ## 🚀 使用方法(3分钟搞定)
25
-
26
- ### 基于 vite
27
-
28
- main.js
29
-
30
- ```js
31
- import "mxcad-app/style";
32
- import { MxCADView } from "mxcad-app";
33
- new MxCADView().create();
34
- ```
35
-
36
- vite.config.js
37
-
38
- ```js
39
- import { defineConfig } from "vite";
40
- import { mxcadAssetsPlugin } from "mxcad-app/vite";
41
-
42
- export default defineConfig({
43
- plugins: [mxcadAssetsPlugin()],
44
- });
45
- ```
46
-
47
- ### 基于 webpack
48
-
49
- webpack.config.js
50
-
51
- ```js
52
- const { MxCadAssetsWebpackPlugin } = require("mxcad-app/webpack");
53
- // webpack.config.js
54
- const webpack = require("webpack");
55
-
56
- module.exports = {
57
- // ...
58
- mode: "development",
59
- module: {
60
- rules: [
61
- {
62
- test: /\.css$/, // 匹配所有 .css 文件
63
- use: [
64
- "style-loader", // 第二步:将 CSS 代码注入到 DOM 的 <style> 标签中
65
- "css-loader", // 第一步:解析 CSS 文件,处理 @import 和 url()
66
- ],
67
- include: [path.resolve(__dirname, "src"), path.resolve(__dirname, "node_modules/mxcad-app")], // 可选:只处理 src 下的 css
68
- },
69
- ],
70
- },
71
- plugins: [
72
- new webpack.ContextReplacementPlugin(
73
- /mxcad-app/, // 匹配包含 mxcad-app 的模块路径
74
- path.resolve(__dirname, "src") // 限制上下文查找范围
75
- ),
76
- new MxCadAssetsWebpackPlugin(),
77
- ],
78
- // ...
79
- devServer: {
80
- static: "./dist",
81
- port: 3000,
82
- },
83
- };
84
- ```
85
-
86
- main.js
87
-
88
- ```js
89
- import "mxcad-app/style";
90
- import { MxCADView } from "mxcad-app";
91
- new MxCADView().create();
92
- ```
93
-
94
- ## 🛠️ 进阶配置
95
-
96
- ### 自定义容器
97
-
98
- ```html
99
- <div id="app"></div>
100
- ```
101
-
102
- ```js
103
- import { MxCADView, mxcadApp } from "mxcad-app";
104
- new MxCADView({
105
- openFile: new URL("test.mxweb", mxcadApp.getStaticAssetPath()).toString(),
106
- rootContainer: "#app",
107
- });
108
- ```
109
-
110
- ### 静态资源设置
111
-
112
- 静态资源设置可以通过调用`setStaticAssetPath`
113
-
114
- ```js
115
- import { mxcadApp } from "mxcad-app";
116
- mxcadApp.setStaticAssetPath("https://unpkg.com/mxcad-app/dist/mxcadAppAssets");
117
- ```
118
-
119
- ## 核心依赖库
120
-
121
- `mxcad-app`内置了[`mxcad`](https://www.mxdraw3d.com/mxcad_docs/zh/1.%E5%BC%80%E5%A7%8B/2.%E5%BF%AB%E9%80%9F%E5%85%A5%E9%97%A8.html) 核心库,你可以直接使用`mxcad` 不需要安装`mxcad`。
122
-
123
-
124
- ```js
125
- import { MxCpp } from 'mxcad'
126
- ```
127
-
128
- 如果不是模块化的方式使用,`mxcad`在`window.MxCAD`挂载你可以直接使用`MxCAD`访问到需要的方法和类。
129
-
130
- `mxcad`依赖`mxdraw`, 你也可以使用`mxdraw`
131
-
132
- ```js
133
- import * as Mx from 'mxdraw'
134
- ```
135
-
136
- 如果不是模块化的方式使用, `mxdraw` 在 `window.Mx` 挂载。你可以直接使用`Mx`访问到需要的方法和类。
137
-
138
- 直接引入`mxcad`和`mxdraw`模块的前提是要使用构建工具构建。我们提供给了webpack和vite的插件, 用于支持模块化开发。
139
-
140
- 只要使用了插件就可以直接使用`import`引入`mxcad`和`mxdraw`模块。
141
-
142
- ### 使用 mxcad-app 依赖映射
143
-
144
- 你可以直接引入使用mxcad-app内部使用的mxcad和mxdraw模块。同时你也可以添加配置`libraryNames`使用其他的外部依赖的npm库。
145
- 目前支持的依赖映射的库有`vue`, `axios`, `vuetify`, `vuetify/components`, `mapboxgl`, `pinia` 你也可以访问`window.MXCADAPP_EXTERNALLIBRARIES`获取到所有提供的依赖库,从而不依赖与构建工具的使用。
146
- 比如`vue`框架,只需要添加依赖映射配置, 如:
147
- vite.config.js
148
-
149
- ```js
150
- import { mxcadAssetsPlugin } from "mxcad-app/vite";
151
- // vite.config.js
152
- export default {
153
- plugins: [
154
- mxcadAssetsPlugin({
155
- libraryNames: ["vue"],
156
- }),
157
- ],
158
- };
159
- ```
160
-
161
- webpack.config.js
162
-
163
- ```js
164
- import { MxCadAssetsWebpackPlugin } from "mxcad-app/webpack";
165
- // webpack.config.js
166
- module.exports = {
167
- // 其他配置...
168
- plugins: [
169
- new MxCadAssetsWebpackPlugin({
170
- libraryNames: ["vue"]
171
- }),
172
- ],
173
- };
174
- ```
175
-
176
- 就可以正常使用mxcad-app中的vue模块(mxcad-app打包的内部vue模块)
177
- ```js
178
- import { ref } from "vue";
179
- const n = ref(1)
180
- ```
181
-
182
- ## 🛠️ 运行时配置修改
183
-
184
- 在构建时修改配置文件:
185
-
186
- ### vite
187
- ```js
188
- import { mxcadAssetsPlugin } from "mxcad-app/vite";
189
-
190
- export default {
191
- plugins: [
192
- mxcadAssetsPlugin({
193
- // 修改UI配置
194
- transformMxcadUiConfig: (config) => {
195
- config.title = "我的CAD"; // 修改标题
196
- return config;
197
- },
198
- // 修改服务器配置
199
- transformMxServerConfig: (config) => {
200
- config.serverUrl = "/api/cad"; // 修改API地址
201
- return config;
202
- },
203
- // 修改快捷命令(命令别名)
204
- // transformMxQuickCommand: (config) => config
205
-
206
- // 修改草图与注释UI模式的配置
207
- // transformMxSketchesAndNotesUiConfig: (config) => config
208
-
209
- // 修改UI配置
210
- // transformMxUiConfig: (config) => config,
211
-
212
- // 修改Vuetify主题配置
213
- // transformVuetifyThemeConfig: (config) => config
214
- })
215
- ]
216
- };
217
- ```
218
-
219
- ### webpack
220
- ```js
221
- import { MxCadAssetsWebpackPlugin } from "mxcad-app/webpack";
222
-
223
- module.exports = {
224
- plugins: [
225
- new MxCadAssetsWebpackPlugin({
226
- transformMxServerConfig: (config) => {
227
- if (process.env.NODE_ENV === 'production') {
228
- config.serverUrl = 'https://api.prod.com/cad';
229
- }
230
- return config;
231
- }
232
- })
233
- ]
234
- };
235
- ```
236
-
237
- ## 📚 常见问题速查
238
-
239
- **Q: 支持哪些CAD格式?**
240
- A: DWG、DXF等主流格式以及自定义文件格式(mxweb)
241
-
242
- **Q: 是否需要安装CAD软件?**
243
- A: 不需要!纯Web方案,浏览器就能用
244
-
245
- **Q: 能否集成到现有系统?**
246
- A: 可以!直接使用mxcad-app就可以无缝集成
247
-
248
- ## 📄 许可证
249
-
250
- `mxcad-app` 是自定义许可证。更多信息,请参阅 [LICENSE](./LICENSE) 文件。
251
-
252
- ---
253
- 如果有任何问题或建议,请随时联系我们。
1
+ # mxcad-app
2
+
3
+ [![npm version](https://badge.fury.io/js/mxcad-app.svg)](https://badge.fury.io/js/mxcad-app)
4
+
5
+ `mxcad-app` 是一个在线 CAD 项目, 用户可以直接集成它。
6
+
7
+ ## 🎯 一句话理解
8
+ **mxcad-app = 一个开箱即用的在线CAD软件**,集成到你的网页就像搭积木一样简单,3分钟就能让你的网站拥有专业CAD功能。
9
+
10
+ ## 📦 安装
11
+
12
+ 使用 npm 或 yarn 安装 `mxcad-app`:
13
+
14
+ ```bash
15
+ npm install mxcad-app --save
16
+ ```
17
+
18
+ 或者
19
+
20
+ ```bash
21
+ yarn add mxcad-app
22
+ ```
23
+
24
+ ## 🚀 使用方法(3分钟搞定)
25
+
26
+ ### 基于 vite
27
+
28
+ main.js
29
+
30
+ ```js
31
+ import "mxcad-app/style";
32
+ import { MxCADView } from "mxcad-app";
33
+ new MxCADView().create();
34
+ ```
35
+
36
+ vite.config.js
37
+
38
+ ```js
39
+ import { defineConfig } from "vite";
40
+ import { mxcadAssetsPlugin } from "mxcad-app/vite";
41
+
42
+ export default defineConfig({
43
+ plugins: [mxcadAssetsPlugin()],
44
+ });
45
+ ```
46
+
47
+ ### 基于 webpack
48
+
49
+ webpack.config.js
50
+
51
+ ```js
52
+ const { MxCadAssetsWebpackPlugin } = require("mxcad-app/webpack");
53
+ // webpack.config.js
54
+ const webpack = require("webpack");
55
+
56
+ module.exports = {
57
+ // ...
58
+ mode: "development",
59
+ module: {
60
+ rules: [
61
+ {
62
+ test: /\.css$/, // 匹配所有 .css 文件
63
+ use: [
64
+ "style-loader", // 第二步:将 CSS 代码注入到 DOM 的 <style> 标签中
65
+ "css-loader", // 第一步:解析 CSS 文件,处理 @import 和 url()
66
+ ],
67
+ include: [path.resolve(__dirname, "src"), path.resolve(__dirname, "node_modules/mxcad-app")], // 可选:只处理 src 下的 css
68
+ },
69
+ ],
70
+ },
71
+ plugins: [
72
+ new webpack.ContextReplacementPlugin(
73
+ /mxcad-app/, // 匹配包含 mxcad-app 的模块路径
74
+ path.resolve(__dirname, "src") // 限制上下文查找范围
75
+ ),
76
+ new MxCadAssetsWebpackPlugin(),
77
+ ],
78
+ // ...
79
+ devServer: {
80
+ static: "./dist",
81
+ port: 3000,
82
+ },
83
+ };
84
+ ```
85
+
86
+ main.js
87
+
88
+ ```js
89
+ import "mxcad-app/style";
90
+ import { MxCADView } from "mxcad-app";
91
+ new MxCADView().create();
92
+ ```
93
+
94
+ ## 🛠️ 进阶配置
95
+
96
+ ### 自定义容器
97
+
98
+ ```html
99
+ <div id="app"></div>
100
+ ```
101
+
102
+ ```js
103
+ import { MxCADView, mxcadApp } from "mxcad-app";
104
+ new MxCADView({
105
+ openFile: new URL("test.mxweb", mxcadApp.getStaticAssetPath()).toString(),
106
+ rootContainer: "#app",
107
+ });
108
+ ```
109
+
110
+ ### 静态资源设置
111
+
112
+ 静态资源设置可以通过调用`setStaticAssetPath`
113
+
114
+ ```js
115
+ import { mxcadApp } from "mxcad-app";
116
+ mxcadApp.setStaticAssetPath("https://unpkg.com/mxcad-app/dist/mxcadAppAssets");
117
+ ```
118
+
119
+ ## 核心依赖库
120
+
121
+ `mxcad-app`内置了[`mxcad`](https://www.mxdraw3d.com/mxcad_docs/zh/1.%E5%BC%80%E5%A7%8B/2.%E5%BF%AB%E9%80%9F%E5%85%A5%E9%97%A8.html) 核心库,你可以直接使用`mxcad` 不需要安装`mxcad`。
122
+
123
+
124
+ ```js
125
+ import { MxCpp } from 'mxcad'
126
+ ```
127
+
128
+ 如果不是模块化的方式使用,`mxcad`在`window.MxCAD`挂载你可以直接使用`MxCAD`访问到需要的方法和类。
129
+
130
+ `mxcad`依赖`mxdraw`, 你也可以使用`mxdraw`
131
+
132
+ ```js
133
+ import * as Mx from 'mxdraw'
134
+ ```
135
+
136
+ 如果不是模块化的方式使用, `mxdraw` 在 `window.Mx` 挂载。你可以直接使用`Mx`访问到需要的方法和类。
137
+
138
+ 直接引入`mxcad`和`mxdraw`模块的前提是要使用构建工具构建。我们提供给了webpack和vite的插件, 用于支持模块化开发。
139
+
140
+ 只要使用了插件就可以直接使用`import`引入`mxcad`和`mxdraw`模块。
141
+
142
+ ### 使用 mxcad-app 依赖映射
143
+
144
+ 你可以直接引入使用mxcad-app内部使用的mxcad和mxdraw模块。同时你也可以添加配置`libraryNames`使用其他的外部依赖的npm库。
145
+ 目前支持的依赖映射的库有`vue`, `axios`, `vuetify`, `vuetify/components`, `mapboxgl`, `pinia` 你也可以访问`window.MXCADAPP_EXTERNALLIBRARIES`获取到所有提供的依赖库,从而不依赖与构建工具的使用。
146
+ 比如`vue`框架,只需要添加依赖映射配置, 如:
147
+ vite.config.js
148
+
149
+ ```js
150
+ import { mxcadAssetsPlugin } from "mxcad-app/vite";
151
+ // vite.config.js
152
+ export default {
153
+ plugins: [
154
+ mxcadAssetsPlugin({
155
+ libraryNames: ["vue"],
156
+ }),
157
+ ],
158
+ };
159
+ ```
160
+
161
+ webpack.config.js
162
+
163
+ ```js
164
+ import { MxCadAssetsWebpackPlugin } from "mxcad-app/webpack";
165
+ // webpack.config.js
166
+ module.exports = {
167
+ // 其他配置...
168
+ plugins: [
169
+ new MxCadAssetsWebpackPlugin({
170
+ libraryNames: ["vue"]
171
+ }),
172
+ ],
173
+ };
174
+ ```
175
+
176
+ 就可以正常使用mxcad-app中的vue模块(mxcad-app打包的内部vue模块)
177
+ ```js
178
+ import { ref } from "vue";
179
+ const n = ref(1)
180
+ ```
181
+
182
+ ## 🛠️ 运行时配置修改
183
+
184
+ 在构建时修改配置文件:
185
+
186
+ ### vite
187
+ ```js
188
+ import { mxcadAssetsPlugin } from "mxcad-app/vite";
189
+
190
+ export default {
191
+ plugins: [
192
+ mxcadAssetsPlugin({
193
+ // 修改UI配置
194
+ transformMxcadUiConfig: (config) => {
195
+ config.title = "我的CAD"; // 修改标题
196
+ return config;
197
+ },
198
+ // 修改服务器配置
199
+ transformMxServerConfig: (config) => {
200
+ config.serverUrl = "/api/cad"; // 修改API地址
201
+ return config;
202
+ },
203
+ // 修改快捷命令(命令别名)
204
+ // transformMxQuickCommand: (config) => config
205
+
206
+ // 修改草图与注释UI模式的配置
207
+ // transformMxSketchesAndNotesUiConfig: (config) => config
208
+
209
+ // 修改UI配置
210
+ // transformMxUiConfig: (config) => config,
211
+
212
+ // 修改Vuetify主题配置
213
+ // transformVuetifyThemeConfig: (config) => config
214
+ })
215
+ ]
216
+ };
217
+ ```
218
+
219
+ ### webpack
220
+ ```js
221
+ import { MxCadAssetsWebpackPlugin } from "mxcad-app/webpack";
222
+
223
+ module.exports = {
224
+ plugins: [
225
+ new MxCadAssetsWebpackPlugin({
226
+ transformMxServerConfig: (config) => {
227
+ if (process.env.NODE_ENV === 'production') {
228
+ config.serverUrl = 'https://api.prod.com/cad';
229
+ }
230
+ return config;
231
+ }
232
+ })
233
+ ]
234
+ };
235
+ ```
236
+
237
+ ## 📚 常见问题速查
238
+
239
+ **Q: 支持哪些CAD格式?**
240
+ A: DWG、DXF等主流格式以及自定义文件格式(mxweb)
241
+
242
+ **Q: 是否需要安装CAD软件?**
243
+ A: 不需要!纯Web方案,浏览器就能用
244
+
245
+ **Q: 能否集成到现有系统?**
246
+ A: 可以!直接使用mxcad-app就可以无缝集成
247
+
248
+ ## 📄 许可证
249
+
250
+ `mxcad-app` 是自定义许可证。更多信息,请参阅 [LICENSE](./LICENSE) 文件。
251
+
252
+ ---
253
+ 如果有任何问题或建议,请随时联系我们。
Binary file
Binary file
Binary file
package/dist/index.cjs.gz CHANGED
Binary file
package/dist/index.d.ts CHANGED
@@ -219,15 +219,15 @@ declare module '@howdyjs/to-drag' {
219
219
 
220
220
  declare module '@tiptap/core' {
221
221
  interface Commands<ReturnType> {
222
- TextDecoration: {
222
+ fontSize: {
223
223
  /**
224
224
  * Set the font size attribute
225
225
  */
226
- setTextDecoration: (textDecoration: string) => ReturnType;
226
+ setFontSize: (size: string) => ReturnType;
227
227
  /**
228
228
  * Unset the font size attribute
229
229
  */
230
- unsetTextDecoration: () => ReturnType;
230
+ unsetFontSize: () => ReturnType;
231
231
  };
232
232
  }
233
233
  }
@@ -235,10 +235,15 @@ declare module '@tiptap/core' {
235
235
 
236
236
  declare module '@tiptap/core' {
237
237
  interface Commands<ReturnType> {
238
- Underline: {
239
- setUnderline: () => ReturnType;
240
- unsetUnderline: () => ReturnType;
241
- toggleUnderline: () => ReturnType;
238
+ TextDecoration: {
239
+ /**
240
+ * Set the font size attribute
241
+ */
242
+ setTextDecoration: (textDecoration: string) => ReturnType;
243
+ /**
244
+ * Unset the font size attribute
245
+ */
246
+ unsetTextDecoration: () => ReturnType;
242
247
  };
243
248
  }
244
249
  }
@@ -273,15 +278,10 @@ declare module "@tiptap/core" {
273
278
 
274
279
  declare module '@tiptap/core' {
275
280
  interface Commands<ReturnType> {
276
- fontSize: {
277
- /**
278
- * Set the font size attribute
279
- */
280
- setFontSize: (size: string) => ReturnType;
281
- /**
282
- * Unset the font size attribute
283
- */
284
- unsetFontSize: () => ReturnType;
281
+ Underline: {
282
+ setUnderline: () => ReturnType;
283
+ unsetUnderline: () => ReturnType;
284
+ toggleUnderline: () => ReturnType;
285
285
  };
286
286
  }
287
287
  }
Binary file
package/dist/mxcad.d.ts CHANGED
@@ -7752,7 +7752,7 @@ declare module "mxcad" {
7752
7752
  * 表示图案填充类,实现实心颜色填充和各种图案填充效果
7753
7753
  * @example
7754
7754
  * ```ts
7755
- import { MxCADUiPrPoint, MxCADUtility, McDbHatch, MxCpp, McDb} from "mxcad"
7755
+ import { MxCADUiPrPoint, MxCADUtility, McDbHatch, MxCpp, McDb, McCmColor} from "mxcad"
7756
7756
  //选点填充
7757
7757
  const getPoint = new MxCADUiPrPoint();
7758
7758
  console.log("\n指定填充区域内部一点:");