vue-sfc-rollup
Advanced tools
Comparing version 2.1.0 to 2.2.0
@@ -7,2 +7,31 @@ # Changelog | ||
## [2.2.0] - 2019-12-28 | ||
### Added | ||
- Add ability to generate typescript-based components/libraries | ||
- Generated components/libraries now both use `npm run serve` for rapid development (via `vue-cli-service`) | ||
- Generate default `.browserslistrc` file | ||
- Replace buble with babel - seeing this more ecosystem-wide | ||
- Allows optional chaining, nullish coalescing support, and other modern language features | ||
- Allows better browser targeting via `.browserslistrc` file | ||
- Output isn't necessarily larger with proper configuration via `.browserslistrc` | ||
### Changed | ||
- Update template dependencies | ||
- **NEW** @babel/core 7.7.7 | ||
- **NEW** @babel/plugin-proposal-nullish-coalescing-operator 7.7.4 | ||
- **NEW** @babel/plugin-proposal-optional-chaining 7.7.5 | ||
- **NEW** @babel/preset-env 7.7.7 | ||
- **NEW** @vue/cli-plugin-babel 4.1.0 | ||
- **NEW** @vue/cli-service 4.1.0 | ||
- **NEW** rollup-plugin-babel 4.3.3 | ||
- rollup 1.27.13 | ||
- rollup-plugin-terser 5.1.3 | ||
- Added new template dependencies for typescript-based projects | ||
- @babel/preset-typescript 7.7.7 | ||
- @vue/cli-plugin-typescript 4.1.0 | ||
- typescript 3.7.3 | ||
- Cli development code refactor/cleanup | ||
## [2.1.0] - 2019-11-07 | ||
@@ -14,3 +43,3 @@ | ||
### Changed | ||
- Do not minify esm build - upstream bundlers should handle this | ||
- Do not minify esm build - upstream bundlers should handle this | ||
- Update template dependencies | ||
@@ -17,0 +46,0 @@ - **NEW** @rollup/plugin-alias 2.2.0 |
@@ -6,3 +6,3 @@ { | ||
"license": "ISC", | ||
"version": "2.1.0", | ||
"version": "2.2.0", | ||
"bin": { | ||
@@ -9,0 +9,0 @@ "sfc-init": "./sfc-init.js" |
@@ -23,8 +23,6 @@ # vue-sfc-rollup | ||
cd path/to/my-component-or-lib | ||
npm install | ||
# Do dev stuff using @vue/cli or other live-refresh coding | ||
# - If single component | ||
vue serve ./src/my-component.vue | ||
# - If library | ||
vue serve ./src/lib-dev.vue | ||
# Do dev stuff | ||
npm run serve | ||
@@ -40,4 +38,17 @@ # Run build process | ||
The vue-sfc-rollup utility scaffolds 4 files (6 in library mode) for you to kick of your SFC development. These files include a minimal [rollup](https://rollupjs.org) config, a corresponding package.json file with build script and dependencies, a wrapper used by rollup when packaging your SFC, and a sample SFC to kick-start development. In library mode, there is also an 'index' which declares the components exposed as part of your library, and a sample library usage file which can be used to load/test your library during development. | ||
The vue-sfc-rollup utility scaffolds 8-13 files (depending on whether you choose library mode and/or typescript support) for you to kick of your SFC development. These files include: | ||
- a minimal [rollup](https://rollupjs.org) config | ||
- a corresponding package.json file with build/dev scripts and dependencies | ||
- a minimal babel.config.js and .browserslistrc file for transpiling | ||
- a wrapper used by rollup when packaging your SFC | ||
- a sample SFC to kick-start development | ||
- a sample usage file which can be used to load/test your component/library during development | ||
In library mode, there is also an 'index' which declares the components exposed as part of your library. | ||
When developing typescript-based components/libraries, the following supporting files will also be created: | ||
- A basic typescript declaration file for your component/library | ||
- Two basic typescript shim declaration files common to vue-typescript development | ||
- A basic tsconfig.json file | ||
If you wish to integrate this into an existing SFC, please check out [the vue-sfc-rollup source](https://github.com/team-innovation/vue-sfc-rollup). The files generated by this utility are located inside the `templates` directory of the repository. Merge the important bits of those file with your existing code, and you'll be good to go. | ||
@@ -69,2 +80,3 @@ | ||
- *component name* (Single Component Mode Only): This is the kebab-case version of your SFC component name - what your component's tag would be if you were to use this in an HTML page or another component. Since any kebab-case tag name would also be a safe file name, this will also be the name of the generated files. | ||
- *javascript/typescript*: Do you wish to use typescript to develop your component/library? | ||
- *save path*: Where do you want to save this component? By default, the wizard will use your current directory and create a new folder with the kebab-case name as your component/library (eg. ./my-component-or-library). | ||
@@ -76,3 +88,3 @@ | ||
vue-sfc-rollup is currently focused on packaging your SFC for distribution via npm. The [Vue CLI](https://cli.vuejs.org/) is excellent for the actual development process of your SFC, and it is recommended you use the official tooling. With v3 of the Vue CLI installed globally, you can truly develop your SFC with zero configuration just by entering the following commands: | ||
vue-sfc-rollup is focused on packaging your SFC for distribution via npm. The [Vue CLI](https://cli.vuejs.org/) is excellent for the actual development process of your SFC, and vue-sfc-rollup comes pre-wired to use this process. With v3 of the Vue CLI installed, you can truly develop your SFC with zero configuration just by entering the following commands: | ||
@@ -82,8 +94,6 @@ ```bash | ||
cd path/to/my-component-or-lib | ||
npm install | ||
# Do dev stuff using @vue/cli or other live-refresh coding | ||
# - If single component | ||
vue serve ./src/my-component.vue | ||
# - If library | ||
vue serve ./src/lib-dev.vue | ||
# Do dev stuff | ||
npm run serve | ||
``` | ||
@@ -90,0 +100,0 @@ |
244
sfc-init.js
@@ -8,24 +8,4 @@ #! /usr/bin/env node | ||
// Helpers for creating kebab-case/PascalCase versions of string | ||
const pascalify = (str) => { | ||
const camelized = str.replace(/-([a-z])/g, (c) => c[1].toUpperCase()); | ||
return camelized.charAt(0).toUpperCase() + camelized.slice(1); | ||
}; | ||
const kebabcase = (string) => string.replace(/([a-z])([A-Z])/g, '$1-$2').replace(/\s+/g, '-').toLowerCase(); | ||
const helpers = require('./lib/helpers'); | ||
// Helper to replace vars in files | ||
const replaceVars = function replaceVars(str, vars) { | ||
return ejs.render(str, vars); | ||
}; | ||
// Helper to ensure directory exists before writing file to it | ||
const ensureDirectoryExists = (filePath) => { | ||
const dirname = path.dirname(filePath); | ||
if (fs.existsSync(dirname)) { | ||
return true; | ||
} | ||
ensureDirectoryExists(dirname); | ||
return fs.mkdirSync(dirname); | ||
}; | ||
// Create cancel function to exit the process | ||
@@ -37,2 +17,3 @@ function onCancel() { | ||
} | ||
// Prepare container for response data | ||
@@ -43,2 +24,3 @@ const responses = { | ||
componentName: '', | ||
language: '', | ||
savePath: '', | ||
@@ -64,8 +46,7 @@ }; | ||
responses.mode = response.mode; | ||
return response.mode; | ||
} | ||
async function getName(mode) { | ||
async function getName() { | ||
const { mode } = responses; | ||
let tmpKebabName = ''; | ||
let tmpSavePath = ''; | ||
const questions = [ | ||
@@ -77,3 +58,3 @@ { | ||
validate(val) { | ||
const kebabName = kebabcase(val).trim(); | ||
const kebabName = helpers.kebabcase(val).trim(); | ||
return (kebabName !== ''); | ||
@@ -90,3 +71,3 @@ }, | ||
validate(val) { | ||
const kebabName = kebabcase(val).trim(); | ||
const kebabName = helpers.kebabcase(val).trim(); | ||
return (kebabName !== ''); | ||
@@ -96,13 +77,2 @@ }, | ||
} | ||
questions.push({ | ||
type: 'text', | ||
name: 'savePath', | ||
message: `Enter a location to save the ${mode} files:`, | ||
initial() { return `./${tmpSavePath}`; }, | ||
validate: (val) => { | ||
// Validate path does not exist, then create directory | ||
const pathExists = fs.existsSync(val); | ||
return !pathExists; | ||
}, | ||
}); | ||
const response = await prompts( | ||
@@ -112,5 +82,4 @@ questions, | ||
onSubmit(prompt, answer) { | ||
if (prompt.name === 'npmName') tmpKebabName = kebabcase(answer).trim(); | ||
if (prompt.name === 'componentName') tmpKebabName = kebabcase(answer).trim(); | ||
tmpSavePath = tmpKebabName; | ||
if (prompt.name === 'npmName') tmpKebabName = helpers.kebabcase(answer).trim(); | ||
if (prompt.name === 'componentName') tmpKebabName = helpers.kebabcase(answer).trim(); | ||
}, | ||
@@ -122,2 +91,45 @@ onCancel, | ||
responses.componentName = response.componentName ? response.componentName : tmpKebabName; | ||
responses.savePath = `./${tmpKebabName}`; | ||
} | ||
async function getLanguage() { | ||
const { mode } = responses; | ||
const question = { | ||
type: 'select', | ||
name: 'language', | ||
message: `Will this ${mode} be written in JavaScript or TypeScript?`, | ||
choices: [ | ||
{ title: 'JavaScript', value: 'js' }, | ||
{ title: 'TypeScript', value: 'ts' }, | ||
], | ||
initial: 0, | ||
}; | ||
const response = await prompts( | ||
question, | ||
{ onCancel }, | ||
); | ||
responses.language = response.language; | ||
} | ||
async function getSavePath() { | ||
const { mode, savePath } = responses; | ||
const questions = [ | ||
{ | ||
type: 'text', | ||
name: 'savePath', | ||
message: `Enter a location to save the ${mode} files:`, | ||
initial() { return savePath; }, | ||
validate: (val) => { | ||
// Validate path does not exist, then create directory | ||
const pathExists = fs.existsSync(val); | ||
return !pathExists; | ||
}, | ||
}, | ||
]; | ||
const response = await prompts( | ||
questions, | ||
{ | ||
onCancel, | ||
}, | ||
); | ||
responses.savePath = path.resolve(response.savePath); | ||
@@ -130,3 +142,3 @@ return response; | ||
// Stop prompting for input, start processing | ||
const componentNamePascal = pascalify(data.componentName); | ||
const componentNamePascal = helpers.pascalify(data.componentName); | ||
const vars = { | ||
@@ -136,79 +148,60 @@ npmName: data.npmName, | ||
componentName: data.componentName, | ||
ts: data.language === 'ts', | ||
}; | ||
const newFiles = { | ||
package: '', | ||
rollupConfig: '', | ||
entryjs: '', | ||
libDev: '', | ||
libExports: '', | ||
component: '', | ||
const files = { | ||
common: [ | ||
'build/rollup.config.js', | ||
{ 'src/entry.ts': `src/entry.${data.language}` }, | ||
{ 'src/serve-dev.ts': `src/serve-dev.${data.language}` }, | ||
'src/serve-dev.vue', | ||
'.browserslistrc', | ||
'babel.config.js', | ||
(data.language === 'ts') ? 'shims-tsx.d.ts' : null, | ||
(data.language === 'ts') ? 'shims-vue.d.ts' : null, | ||
(data.language === 'ts') ? 'tsconfig.json' : null, | ||
], | ||
single: [ | ||
{ 'src/component.vue': `src/${data.componentName}.vue` }, | ||
{ 'single-package.json': 'package.json' }, | ||
(data.language === 'ts') ? { 'single-component.d.ts': `${data.componentName}.d.ts` } : null, | ||
], | ||
library: [ | ||
{ 'src/lib-components/component.vue': `src/lib-components/${data.componentName}-sample.vue` }, | ||
{ 'src/lib-components/index.ts': `src/lib-components/index.${data.language}` }, | ||
{ 'library-package.json': 'package.json' }, | ||
(data.language === 'ts') ? { 'library.d.ts': `${data.componentName}.d.ts` } : null, | ||
], | ||
}; | ||
const paths = { | ||
package: path.join(data.savePath, 'package.json'), | ||
rollupConfig: path.join(data.savePath, 'build', 'rollup.config.js'), | ||
entryjs: path.join(data.savePath, 'src', 'entry.js'), | ||
libDev: null, | ||
libExports: null, | ||
component: null, | ||
}; | ||
// Single component mode | ||
if (data.mode === 'component') { | ||
newFiles.package = replaceVars( | ||
fs.readFileSync(path.join(__dirname, 'templates', 'single', 'single-package.json')).toString(), | ||
vars, | ||
); | ||
newFiles.rollupConfig = replaceVars( | ||
fs.readFileSync(path.join(__dirname, 'templates', 'single', 'build', 'rollup.config.js')).toString(), | ||
vars, | ||
); | ||
newFiles.entryjs = replaceVars( | ||
fs.readFileSync(path.join(__dirname, 'templates', 'single', 'src', 'entry.js')).toString(), | ||
vars, | ||
); | ||
delete newFiles.libDev; | ||
delete newFiles.libExports; | ||
newFiles.component = replaceVars( | ||
fs.readFileSync(path.join(__dirname, 'templates', 'single', 'src', 'component.vue')).toString(), | ||
vars, | ||
); | ||
delete paths.libDev; | ||
delete paths.libExports; | ||
paths.component = path.join(data.savePath, 'src', `${data.componentName}.vue`); | ||
} | ||
const fileActions = [ | ||
...files.common.filter((entry) => entry), // remove null entries | ||
...files[data.mode === 'component' ? 'single' : 'library'].filter((entry) => entry), // remove null entries | ||
]; | ||
// Library mode | ||
if (data.mode === 'library') { | ||
newFiles.package = replaceVars( | ||
fs.readFileSync(path.join(__dirname, 'templates', 'library', 'library-package.json')).toString(), | ||
vars, | ||
fileActions.forEach((entry) => { | ||
// If action is just a string, copy directly. If object, | ||
// rename from key to value | ||
let srcPath; | ||
let destPath; | ||
if (typeof entry === 'string') { | ||
srcPath = entry; | ||
destPath = entry; | ||
} else { | ||
[[srcPath, destPath]] = Object.entries(entry); | ||
} | ||
srcPath = path.join.apply(null, [ | ||
__dirname, | ||
'templates', | ||
data.mode === 'component' ? 'single' : 'library', | ||
...srcPath.split('/'), | ||
]); | ||
destPath = path.join.apply(null, [ | ||
data.savePath, | ||
...destPath.split('/'), | ||
]); | ||
helpers.ensureDirectoryExists(destPath); | ||
fs.writeFileSync( | ||
destPath, | ||
ejs.render(fs.readFileSync(srcPath).toString(), vars), | ||
); | ||
newFiles.rollupConfig = replaceVars( | ||
fs.readFileSync(path.join(__dirname, 'templates', 'library', 'build', 'rollup.config.js')).toString(), | ||
vars, | ||
); | ||
newFiles.entryjs = replaceVars( | ||
fs.readFileSync(path.join(__dirname, 'templates', 'library', 'src', 'entry.js')).toString(), | ||
vars, | ||
); | ||
newFiles.libDev = replaceVars( | ||
fs.readFileSync(path.join(__dirname, 'templates', 'library', 'src', 'lib-dev.vue')).toString(), | ||
vars, | ||
); | ||
newFiles.libExports = replaceVars( | ||
fs.readFileSync(path.join(__dirname, 'templates', 'library', 'src', 'lib-components', 'index.js')).toString(), | ||
vars, | ||
); | ||
newFiles.component = replaceVars( | ||
fs.readFileSync(path.join(__dirname, 'templates', 'library', 'src', 'lib-components', 'component.vue')).toString(), | ||
vars, | ||
); | ||
paths.libDev = path.join(data.savePath, 'src', 'lib-dev.vue'); | ||
paths.libExports = path.join(data.savePath, 'src', 'lib-components', 'index.js'); | ||
paths.component = path.join(data.savePath, 'src', 'lib-components', `${data.componentName}-sample.vue`); | ||
} | ||
Object.keys(paths).forEach((key) => { | ||
ensureDirectoryExists(paths[key]); | ||
fs.writeFileSync(paths[key], newFiles[key]); | ||
}); | ||
@@ -222,5 +215,8 @@ | ||
Within that directory, use src/${data.componentName}.vue as a starting point for your SFC. | ||
When you're ready, run \`npm run build\` to generate the redistributable versions. | ||
`; | ||
When you're ready, run \`npm run build\` to generate the redistributable versions.`; | ||
if (data.language === 'ts') { | ||
completeMessage = `${completeMessage} | ||
**NOTE** The default ${data.componentName}.d.ts is not automatically updated. Be sure to keep this | ||
file up to date!`; | ||
} | ||
} | ||
@@ -231,7 +227,13 @@ if (data.mode === 'library') { | ||
Within that directory, you will find a sample SFC at src/lib-components/${data.componentName}-sample.vue. | ||
Any components you wish to expose as part of your library should be saved in that directory, and | ||
an entry must be added to src/lib-components/index.js so that rollup is aware of it. When you're | ||
ready, run \`npm run build\` to generate the redistributable versions. | ||
**NOTE** Any components you wish to expose as part of your library should be saved in that directory, and | ||
an entry must be added to src/lib-components/index.${data.language}`; | ||
`; | ||
if (data.language === 'ts') { | ||
completeMessage = `${completeMessage} and ${data.componentName}.d.ts so rollup is aware of it | ||
and typescript users can receive proper support.`; | ||
} else { | ||
completeMessage = `${completeMessage} so that rollup is aware of it.`; | ||
} | ||
completeMessage = `${completeMessage} | ||
When you're ready, run npm run build to generate the redistributable versions.`; | ||
} | ||
@@ -245,4 +247,6 @@ // eslint-disable-next-line no-console | ||
.then(getName) | ||
.then(getLanguage) | ||
.then(getSavePath) | ||
.then(() => { | ||
scaffold(responses); | ||
}); |
// rollup.config.js | ||
import fs from 'fs'; | ||
import path from 'path'; | ||
import vue from 'rollup-plugin-vue'; | ||
import alias from '@rollup/plugin-alias'; | ||
import buble from '@rollup/plugin-buble'; | ||
import commonjs from 'rollup-plugin-commonjs'; | ||
import replace from '@rollup/plugin-replace'; | ||
import babel from 'rollup-plugin-babel'; | ||
import { terser } from 'rollup-plugin-terser'; | ||
import minimist from 'minimist'; | ||
// Get browserslist config and remove ie from es build targets | ||
const esbrowserslist = fs.readFileSync('./.browserslistrc') | ||
.toString() | ||
.split('\n') | ||
.filter((entry) => entry && entry.substring(0, 2) !== 'ie'); | ||
const argv = minimist(process.argv.slice(2)); | ||
@@ -16,3 +23,3 @@ | ||
const baseConfig = { | ||
input: 'src/entry.js', | ||
input: 'src/entry.<% if (ts) {%>ts<% } else { %>js<% } %>', | ||
plugins: { | ||
@@ -25,3 +32,3 @@ preVue: [ | ||
alias({ | ||
resolve: ['.jsx', '.js', '.vue'], | ||
resolve: ['.js', '.jsx', '.ts', '.tsx', '.vue'], | ||
entries: { | ||
@@ -38,5 +45,6 @@ '@': path.resolve(projectRoot, 'src'), | ||
}, | ||
postVue: [ | ||
buble(), | ||
], | ||
babel: { | ||
exclude: 'node_modules/**', | ||
extensions: ['.js', '.jsx', '.ts', '.tsx', '.vue'], | ||
}, | ||
}, | ||
@@ -50,2 +58,3 @@ }; | ||
// eg. 'jquery' | ||
'vue', | ||
]; | ||
@@ -58,2 +67,3 @@ | ||
// eg. jquery: '$' | ||
vue: 'Vue', | ||
}; | ||
@@ -75,3 +85,13 @@ | ||
vue(baseConfig.plugins.vue), | ||
...baseConfig.plugins.postVue, | ||
babel({ | ||
...baseConfig.plugins.babel, | ||
presets: [ | ||
[ | ||
'@babel/preset-env', | ||
{ | ||
targets: esbrowserslist, | ||
}, | ||
], | ||
], | ||
}), | ||
], | ||
@@ -103,3 +123,3 @@ }; | ||
}), | ||
...baseConfig.plugins.postVue, | ||
babel(baseConfig.plugins.babel), | ||
], | ||
@@ -125,3 +145,3 @@ }; | ||
vue(baseConfig.plugins.vue), | ||
...baseConfig.plugins.postVue, | ||
babel(baseConfig.plugins.babel), | ||
terser({ | ||
@@ -128,0 +148,0 @@ output: { |
@@ -9,10 +9,17 @@ { | ||
"unpkg": "dist/<%-componentName%>.min.js", | ||
<% if (ts) { -%> | ||
"types": "<%-componentName%>.d.ts", | ||
<% } -%> | ||
"files": [ | ||
"dist/*", | ||
<% if (ts) { -%> | ||
"<%-componentName%>.d.ts", | ||
<% } -%> | ||
"src/**/*.vue", | ||
"!src/lib-dev.vue" | ||
"!src/serve-dev.*" | ||
], | ||
"scripts": { | ||
"serve": "vue-cli-service serve src/serve-dev.<% if (ts) { %>ts<% } else { %>js<% } %>", | ||
"build": "cross-env NODE_ENV=production rollup --config build/rollup.config.js", | ||
@@ -28,14 +35,32 @@ "build:ssr": "cross-env NODE_ENV=production rollup --config build/rollup.config.js --format cjs", | ||
"devDependencies": { | ||
"@babel/core": "^7.7.7", | ||
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.7.4", | ||
"@babel/plugin-proposal-optional-chaining": "^7.7.5", | ||
"@babel/preset-env": "^7.7.7", | ||
<% if (ts) { -%> | ||
"@babel/preset-typescript": "^7.7.7", | ||
<% } -%> | ||
"@rollup/plugin-alias": "^2.2.0", | ||
"@rollup/plugin-buble": "^0.20.0", | ||
"@rollup/plugin-replace": "^2.2.1", | ||
"@vue/cli-plugin-babel": "^4.1.0", | ||
<% if (ts) { -%> | ||
"@vue/cli-plugin-typescript": "^4.1.0", | ||
<% } -%> | ||
"@vue/cli-service": "^4.1.0", | ||
"cross-env": "^6.0.3", | ||
"minimist": "^1.2.0", | ||
"rollup": "^1.26.3", | ||
"rollup": "^1.27.13", | ||
"rollup-plugin-commonjs": "^10.1.0", | ||
"rollup-plugin-terser": "^5.1.2", | ||
"rollup-plugin-babel": "^4.3.3", | ||
"rollup-plugin-terser": "^5.1.3", | ||
"rollup-plugin-vue": "5.1.1", | ||
<% if (ts) { -%> | ||
"typescript": "^3.7.3", | ||
<% } -%> | ||
"vue": "^2.6.10", | ||
"vue-template-compiler": "^2.6.10" | ||
}, | ||
"peerDependencies": { | ||
"vue": "^2.6.10" | ||
}, | ||
"engines": { | ||
@@ -42,0 +67,0 @@ "node": ">=8" |
// rollup.config.js | ||
import fs from 'fs'; | ||
import path from 'path'; | ||
import vue from 'rollup-plugin-vue'; | ||
import alias from '@rollup/plugin-alias'; | ||
import buble from '@rollup/plugin-buble'; | ||
import commonjs from 'rollup-plugin-commonjs'; | ||
import replace from '@rollup/plugin-replace'; | ||
import babel from 'rollup-plugin-babel'; | ||
import { terser } from 'rollup-plugin-terser'; | ||
import minimist from 'minimist'; | ||
// Get browserslist config and remove ie from es build targets | ||
const esbrowserslist = fs.readFileSync('./.browserslistrc') | ||
.toString() | ||
.split('\n') | ||
.filter((entry) => entry && entry.substring(0, 2) !== 'ie'); | ||
const argv = minimist(process.argv.slice(2)); | ||
@@ -16,3 +23,3 @@ | ||
const baseConfig = { | ||
input: 'src/entry.js', | ||
input: 'src/entry.<% if (ts) {%>ts<% } else { %>js<% } %>', | ||
plugins: { | ||
@@ -25,3 +32,3 @@ preVue: [ | ||
alias({ | ||
resolve: ['.jsx', '.js', '.vue'], | ||
resolve: ['.js', '.jsx', '.ts', '.tsx', '.vue'], | ||
entries: { | ||
@@ -38,5 +45,6 @@ '@': path.resolve(projectRoot, 'src'), | ||
}, | ||
postVue: [ | ||
buble(), | ||
], | ||
babel: { | ||
exclude: 'node_modules/**', | ||
extensions: ['.js', '.jsx', '.ts', '.tsx', '.vue'], | ||
}, | ||
}, | ||
@@ -50,2 +58,3 @@ }; | ||
// eg. 'jquery' | ||
'vue', | ||
]; | ||
@@ -58,2 +67,3 @@ | ||
// eg. jquery: '$' | ||
vue: 'Vue', | ||
}; | ||
@@ -75,3 +85,13 @@ | ||
vue(baseConfig.plugins.vue), | ||
...baseConfig.plugins.postVue, | ||
babel({ | ||
...baseConfig.plugins.babel, | ||
presets: [ | ||
[ | ||
'@babel/preset-env', | ||
{ | ||
targets: esbrowserslist, | ||
}, | ||
], | ||
], | ||
}), | ||
], | ||
@@ -103,3 +123,3 @@ }; | ||
}), | ||
...baseConfig.plugins.postVue, | ||
babel(baseConfig.plugins.babel), | ||
], | ||
@@ -125,3 +145,3 @@ }; | ||
vue(baseConfig.plugins.vue), | ||
...baseConfig.plugins.postVue, | ||
babel(baseConfig.plugins.babel), | ||
terser({ | ||
@@ -128,0 +148,0 @@ output: { |
@@ -9,9 +9,17 @@ { | ||
"unpkg": "dist/<%-componentName%>.min.js", | ||
<% if (ts) { -%> | ||
"types": "<%-componentName%>.d.ts", | ||
<% } -%> | ||
"files": [ | ||
"dist/*", | ||
"src/**/*.vue" | ||
<% if (ts) { -%> | ||
"<%-componentName%>.d.ts", | ||
<% } -%> | ||
"src/**/*.vue", | ||
"!src/serve-dev.*" | ||
], | ||
"scripts": { | ||
"serve": "vue-cli-service serve src/serve-dev.<% if (ts) { %>ts<% } else { %>js<% } %>", | ||
"build": "cross-env NODE_ENV=production rollup --config build/rollup.config.js", | ||
@@ -27,14 +35,32 @@ "build:ssr": "cross-env NODE_ENV=production rollup --config build/rollup.config.js --format cjs", | ||
"devDependencies": { | ||
"@babel/core": "^7.7.7", | ||
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.7.4", | ||
"@babel/plugin-proposal-optional-chaining": "^7.7.5", | ||
"@babel/preset-env": "^7.7.7", | ||
<% if (ts) { -%> | ||
"@babel/preset-typescript": "^7.7.7", | ||
<% } -%> | ||
"@rollup/plugin-alias": "^2.2.0", | ||
"@rollup/plugin-buble": "^0.20.0", | ||
"@rollup/plugin-replace": "^2.2.1", | ||
"@vue/cli-plugin-babel": "^4.1.0", | ||
<% if (ts) { -%> | ||
"@vue/cli-plugin-typescript": "^4.1.0", | ||
<% } -%> | ||
"@vue/cli-service": "^4.1.0", | ||
"cross-env": "^6.0.3", | ||
"minimist": "^1.2.0", | ||
"rollup": "^1.26.3", | ||
"rollup": "^1.27.13", | ||
"rollup-plugin-commonjs": "^10.1.0", | ||
"rollup-plugin-terser": "^5.1.2", | ||
"rollup-plugin-babel": "^4.3.3", | ||
"rollup-plugin-terser": "^5.1.3", | ||
"rollup-plugin-vue": "5.1.1", | ||
<% if (ts) { -%> | ||
"typescript": "^3.7.3", | ||
<% } -%> | ||
"vue": "^2.6.10", | ||
"vue-template-compiler": "^2.6.10" | ||
}, | ||
"peerDependencies": { | ||
"vue": "^2.6.10" | ||
}, | ||
"engines": { | ||
@@ -41,0 +67,0 @@ "node": ">=8" |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
41478
30
774
114
4
1