How can ant design vue be implemented in HTML?
I attempted to install this library using npm and obtained the following files: antd.js, antd-with-locales.js.map, antd.js.map, antd-with-locales.min.js, antd.min.js, antd-with-locales.min.js.LICENSE.txt, antd.min.js.LICENSE.txt, antd-with-locales.min.js.map, antd.min.js.map, reset.css, antd-with-locales.js. I tried including them in my code within script tags, but encountered an error in the console. This is the code snippet:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://unpkg.com/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="177679633a7372647e70793a616272572339273924">[email protected]</a>/dist/reset.css">
<script src="https://unpkg.com/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f5838090b5c6dbc6dbc1">[email protected]</a>/dist/vue.global.js"></script>
<!-- Other dayjs scripts -->
<title>My first ant design vue page</title>
</head>
<body>
<template>
<a-button>Add</a-button>
</template>
<script src="https://unpkg.com/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="83e2edf7aee7e6f0eae4edaef5f6e6c3b7adb3adb0">[email protected]</a>/dist/antd.min.js"></script>
<script>
import { Button } from 'ant-design-vue';
const ButtonGroup = Button.Group;
export default {
components: {
AButton: Button,
AButtonGroup: ButtonGroup,
},
};
</script>
</body>
</html>
This is the error message I received:
Uncaught SyntaxError: Cannot use import statement outside a module (at first.html:24:9)