Skip to content

Commit

Permalink
Attempting vite.
Browse files Browse the repository at this point in the history
  • Loading branch information
dlrice committed Jan 10, 2025
1 parent 6513586 commit a6a80cd
Show file tree
Hide file tree
Showing 37 changed files with 2,541 additions and 7,380 deletions.
62 changes: 31 additions & 31 deletions .storybook/main.js
Original file line number Diff line number Diff line change
@@ -1,40 +1,40 @@
const path = require("path");
import { dirname, join } from "path";
import remarkGfm from "remark-gfm";

module.exports = {
stories: [
"../stories/**/*.stories.mdx",
"../stories/**/*.stories.@(js|jsx|ts|tsx)",
],
stories: ["../stories/**/*.mdx", "../stories/**/*.stories.@(js|jsx|ts|tsx)"],

addons: [
"@storybook/addon-links",
"@storybook/addon-essentials",
"@storybook/addon-a11y",
"@storybook/addon-storysource",
"@storybook/addon-actions",
getAbsolutePath("@storybook/addon-links"),
getAbsolutePath("@storybook/addon-essentials"),
getAbsolutePath("@storybook/addon-a11y"),
getAbsolutePath("@storybook/addon-storysource"),
getAbsolutePath("@storybook/addon-actions"),
getAbsolutePath("@storybook/addon-mdx-gfm"),
{
name: "@storybook/addon-docs",
options: {
mdxPluginOptions: {
mdxCompileOptions: {
remarkPlugins: [remarkGfm],
},
},
},
},
],

typescript: {
check: false,
},
core: {
builder: "webpack5",
},
webpackFinal: (config) => {
config.resolve.alias = {
...config.resolve.alias,
"@nightingale-elements/nightingale-new-core": path.resolve(
__dirname,
"../packages/nightingale-new-core/src/index.ts",
),
};
config.module.rules.push({
test: /\.(ts|tsx)$/,
include: path.resolve(__dirname, "../packages"),
loader: "ts-loader",
});
config.module.rules.push({
test: /\.(tsv)$/,
type: "asset/source",
});
return config;

framework: {
name: getAbsolutePath("@storybook/web-components-vite"),
options: {},
},

docs: {},
};

function getAbsolutePath(value) {
return dirname(require.resolve(join(value, "package.json")));
}
1 change: 1 addition & 0 deletions .storybook/preview.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,3 +9,4 @@ export const parameters = {
},
},
};
export const tags = ["autodocs"];
35 changes: 20 additions & 15 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -18,29 +18,31 @@
"serve": "wds --node-resolve --watch",
"serve:prod": "MODE=prod yarn serve",
"checksize": "rollup -c ; cat my-element.bundled.js | gzip -9 | wc -c ; rm my-element.bundled.js",
"storybook": "start-storybook -p 6006",
"build-storybook": "build-storybook"
"storybook": "storybook dev -p 6006",
"build-storybook": "storybook build"
},
"license": "MIT",
"resolutions": {
"@storybook/{app}/webpack": "5.91.0"
},
"devDependencies": {
"@babel/core": "7.24.5",
"@codesandbox/sandpack-react": "2.13.10",
"@custom-elements-manifest/analyzer": "0.10.2",
"@mdx-js/rollup": "^3.1.0",
"@rollup/plugin-commonjs": "25.0.7",
"@rollup/plugin-json": "6.1.0",
"@rollup/plugin-node-resolve": "15.2.3",
"@rollup/plugin-typescript": "11.1.6",
"@storybook/addon-a11y": "6.5.16",
"@storybook/addon-actions": "6.5.16",
"@storybook/addon-essentials": "6.5.16",
"@storybook/addon-links": "6.5.16",
"@storybook/addon-storysource": "6.5.16",
"@storybook/builder-webpack5": "6.5.16",
"@storybook/manager-webpack5": "6.5.16",
"@storybook/web-components": "6.5.16",
"@storybook/addon-a11y": "^8.4.7",
"@storybook/addon-actions": "^8.4.7",
"@storybook/addon-docs": "^8.4.7",
"@storybook/addon-essentials": "^8.4.7",
"@storybook/addon-links": "^8.4.7",
"@storybook/addon-mdx-gfm": "^8.4.7",
"@storybook/addon-storysource": "^8.4.7",
"@storybook/addons": "6.5.16",
"@storybook/core-server": "^8.4.7",
"@storybook/mdx2-csf": "^1.1.0",
"@storybook/web-components": "^8.4.7",
"@storybook/web-components-vite": "^8.4.7",
"@types/d3": "7.4.3",
"@types/jest": "29.5.12",
"@types/lodash-es": "4.17.12",
Expand All @@ -60,14 +62,17 @@
"prettier": "3.2.5",
"rimraf": "5.0.5",
"rollup": "4.17.2",
"rollup-plugin-css-only": "4.5.2",
"rollup-plugin-css-only": "^4.5.2",
"rollup-plugin-esbuild": "^6.1.1",
"rollup-plugin-terser": "7.0.2",
"rollup-plugin-web-worker-loader": "1.6.1",
"storybook": "^8.4.7",
"ts-jest": "29.1.2",
"ts-loader": "9.5.1",
"tslib": "2.6.2",
"typescript": "5.4.5",
"webpack": "5.91.0"
"vite": "^6.0.7",
"vite-plugin-dts": "^4.5.0"
},
"workspaces": [
"packages/*"
Expand Down
10 changes: 5 additions & 5 deletions rollup.config.mjs
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import typescript from "@rollup/plugin-typescript";
import { nodeResolve } from "@rollup/plugin-node-resolve";
import commonjs from "@rollup/plugin-commonjs";
import { terser } from "rollup-plugin-terser";
import esbuild from "rollup-plugin-esbuild";
import json from "@rollup/plugin-json";
import css from "rollup-plugin-css-only";

Expand All @@ -18,10 +18,10 @@ export default {
commonjs(),
typescript(),
json(),
terser({
ecma: 2020,
module: true,
warnings: true,
// Replace terser with esbuild for minification
esbuild({
target: "es2021", // Set the output target for minification
minify: true, // Enable minification
}),
],
external: (id) => /@nightingale-elements/.test(id),
Expand Down
File renamed without changes.
Original file line number Diff line number Diff line change
Expand Up @@ -27,19 +27,19 @@ After these steps we can use the component just as you would a regular HTML tag.
<Sandpack
template="static"
files={{
"index.html": `<!-- Firstly create an importmap to resolve module imports -->
"index.html": `{/* Firstly create an importmap to resolve module imports */}
<script type="importmap">
{
"imports": {
"@nightingale-elements/": "https://cdn.jsdelivr.net/npm/@nightingale-elements/"
}
}
</script>
<!-- Import the component -->
{/* Import the component */}
<script type="module">
import "@nightingale-elements/nightingale-sequence@latest";
</script>
<!-- Use the component just as you would a regular HTML tag -->
{/* Use the component just as you would a regular HTML tag */}
<nightingale-sequence
sequence="SEQUENCESEQUENCESEQUENCESEQUENCE"
width="800"
Expand Down Expand Up @@ -67,7 +67,7 @@ it's also possible to load this as a property as seen in the following code snip
<Sandpack
template="static"
files={{
"index.html": `<!-- Firstly create an importmap to resolve module imports -->
"index.html": `{/* Firstly create an importmap to resolve module imports */}
<script type="importmap">
{
"imports": {
Expand All @@ -85,7 +85,7 @@ it's also possible to load this as a property as seen in the following code snip
seq.data = "SEQUENCESEQUENCESEQUENCESEQUENCE";
})
</script>
<!-- Use the component just as you would a regular HTML tag -->
{/* Use the component just as you would a regular HTML tag */}
<nightingale-sequence
width="800"
height="40"
Expand Down
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
31 changes: 31 additions & 0 deletions vite.config.mjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import { defineConfig } from "vite";
import commonjs from "@rollup/plugin-commonjs";
import css from "rollup-plugin-css-only";
import dts from "vite-plugin-dts";

export default defineConfig({
plugins: [
{
...css(),
enforce: "post",
},
commonjs(),
dts({
outputDir: "dist/types",
}),
],
build: {
lib: {
entry: "src/index.ts",
formats: ["es"],
fileName: "index",
},
sourcemap: true,
rollupOptions: {
external: (id) => /@nightingale-elements/.test(id),
output: {
dir: "./dist",
},
},
},
});
Loading

0 comments on commit a6a80cd

Please sign in to comment.