diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml
index ec4ec6e..a0d3b93 100644
--- a/.github/workflows/e2e.yml
+++ b/.github/workflows/e2e.yml
@@ -11,7 +11,7 @@ jobs:
uses: cypress-io/github-action@v4
with:
build: npm run example:build
- start: npm run example:serve
- wait-on: http://localhost:5000
+ start: npm run example:preview
+ wait-on: http://localhost:4173
env:
ACTIONS_ALLOW_UNSECURE_COMMANDS: 'true'
diff --git a/README.md b/README.md
index 4f6f88e..32e3800 100644
--- a/README.md
+++ b/README.md
@@ -92,10 +92,9 @@ import IconWithoutOptimizer from './my-icon.svg?skipsvgo'
```
### Use with TypeScript
-If you use the loader in a Typescript project, you'll need to import your svg files with the `?component` param: `import MyIcon from './my-icon.svg?component'`.
-
-You'll also need to reference the type definitions:
+If you use the loader in a Typescript project, you'll need to reference the type definitions inside `vite-env.d.ts`:
```ts
+///
///
```
diff --git a/cypress.json b/cypress.json
index c4043d1..85990ea 100644
--- a/cypress.json
+++ b/cypress.json
@@ -1,4 +1,5 @@
{
- "baseUrl": "http://localhost:5000",
+ "baseUrl": "http://localhost:4173",
+ "screenshotOnRunFailure": false,
"video": false
}
diff --git a/cypress/fixtures/example.json b/cypress/fixtures/example.json
deleted file mode 100644
index 02e4254..0000000
--- a/cypress/fixtures/example.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
- "name": "Using fixtures to represent data",
- "email": "hello@cypress.io",
- "body": "Fixtures are a great way to mock data for responses to routes"
-}
diff --git a/cypress/integration/spec.js b/cypress/integration/spec.js
index bc4b08e..081e52c 100644
--- a/cypress/integration/spec.js
+++ b/cypress/integration/spec.js
@@ -42,7 +42,7 @@ describe('Vite SVG Loader', () => {
})
it('supports ?url param', () => {
- cy.get('#url').contains(/^\/assets\/test\..+\.svg/)
+ cy.get('#url').contains(/^data:image\/svg\+xml/)
})
it('supports ?raw param', () => {
diff --git a/example/.gitignore b/example/.gitignore
new file mode 100644
index 0000000..a547bf3
--- /dev/null
+++ b/example/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/example/.vscode/extensions.json b/example/.vscode/extensions.json
new file mode 100644
index 0000000..c0a6e5a
--- /dev/null
+++ b/example/.vscode/extensions.json
@@ -0,0 +1,3 @@
+{
+ "recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
+}
diff --git a/example/README.md b/example/README.md
new file mode 100644
index 0000000..ef72fd5
--- /dev/null
+++ b/example/README.md
@@ -0,0 +1,18 @@
+# Vue 3 + TypeScript + Vite
+
+This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `
+
+