feat(cli): build package style entry

This commit is contained in:
陈嘉涵 2019-11-29 11:37:48 +08:00
parent 964b2cf3bf
commit 19a1ab37ef
11 changed files with 66 additions and 27 deletions

View File

@ -32,6 +32,7 @@
"@types/fs-extra": "^8.0.1",
"@types/html-webpack-plugin": "^3.2.1",
"@types/less": "^3.0.1",
"@types/lodash": "^4.14.149",
"@types/postcss-load-config": "^2.0.0",
"@types/sass": "^1.16.0",
"@types/shelljs": "^0.8.6",
@ -82,6 +83,7 @@
"less": "^3.10.3",
"less-loader": "^5.0.0",
"lint-staged": "^9.4.2",
"lodash": "^4.17.15",
"portfinder": "^1.0.25",
"postcss": "^7.0.21",
"postcss-loader": "^3.0.0",

View File

@ -17,7 +17,7 @@ export default {
data() {
return {
config,
config: config.site,
simulator: `mobile.html${location.hash}`
};
}

View File

@ -10,9 +10,9 @@
<search-input v-if="searchConfig" :lang="lang" :search-config="searchConfig" />
<ul class="van-doc-header__top-nav">
<li v-for="item in config.iconLinks" class="van-doc-header__top-nav-item">
<li v-for="item in config.links" class="van-doc-header__top-nav-item">
<a class="van-doc-header__logo-link" target="_blank" :href="item.url">
<img :src="item.image">
<img :src="item.logo">
</a>
</li>

View File

@ -26,7 +26,7 @@ export default {
data() {
return {
config
config: config.site
};
}
};

View File

@ -2,11 +2,12 @@ import webpack from 'webpack';
import WebpackDevServer from 'webpack-dev-server';
import { getPort } from 'portfinder';
import { clean } from '../commands/clean';
import { buildESModuleOutputs } from './build';
import { siteDevConfig } from '../config/webpack.site.dev';
import { genPackageEntry } from '../compiler/gen-package-entry';
import { genMobileEntry } from '../compiler/gen-mobile-entry';
import { genDesktopEntry } from '../compiler/gen-desktop-entry';
import { genStyleDepsMap } from '../compiler/gen-style-deps-map';
import { genDepsMap } from '../compiler/gen-style-deps-map';
function runWebpack() {
const server = new WebpackDevServer(
@ -33,9 +34,10 @@ function runWebpack() {
);
}
export function dev() {
clean();
genStyleDepsMap();
export async function dev() {
await clean();
await buildESModuleOutputs();
genDepsMap();
genPackageEntry();
genMobileEntry();
genDesktopEntry();

View File

@ -5,7 +5,7 @@ export const ES_DIR = join(CWD, 'es');
export const LIB_DIR = join(CWD, 'lib');
export const SRC_DIR = join(CWD, 'src');
export const DOCS_DIR = join(CWD, 'docs');
export const CONFIG_FILE = join(CWD, 'components.config.js');
export const CONFIG_FILE = join(CWD, 'vant.config.js');
export const PACKAGE_JSON_FILE = join(CWD, 'package.json');
export const WEBPACK_CONFIG_FILE = join(CWD, 'webpack.config.js');
@ -13,6 +13,7 @@ export const DIST_DIR = join(__dirname, '../../dist');
export const CONFIG_DIR = join(__dirname, '../config');
export const PACKAGE_ENTRY_FILE = join(DIST_DIR, 'package-entry.js');
export const PACKAGE_STYLE_FILE = join(DIST_DIR, 'package-style.css');
export const MOBILE_ENTRY_FILE = join(DIST_DIR, 'mobile-entry.js');
export const DESKTOP_ENTRY_FILE = join(DIST_DIR, 'desktop-entry.js');
export const STYPE_DEPS_JSON_FILE = join(DIST_DIR, 'style-deps.json');
@ -23,3 +24,6 @@ export const POSTCSS_CONFIG_FILE = join(CONFIG_DIR, 'postcss.config.js');
export const JEST_TRANSFORM_FILE = join(CONFIG_DIR, 'jest.transform.js');
export const JEST_FILE_MOCK_FILE = join(CONFIG_DIR, 'jest.file-mock.js');
export const JEST_STYLE_MOCK_FILE = join(CONFIG_DIR, 'jest.style-mock.js');
// eslint-disable-next-line
export const CONFIG = require(CONFIG_FILE);

View File

@ -2,10 +2,10 @@ import { join, relative } from 'path';
import { existsSync, ensureDirSync, writeFileSync } from 'fs-extra';
import { decamelize, pascalize, removeExt, getComponents } from '../common';
import {
CONFIG,
SRC_DIR,
DIST_DIR,
MOBILE_ENTRY_FILE,
CONFIG_FILE
MOBILE_ENTRY_FILE
} from '../common/constant';
type DemoItem = {
@ -38,15 +38,14 @@ function genExports(demos: DemoItem[]) {
function genConfig(demos: DemoItem[]) {
// eslint-disable-next-line
const config = require(CONFIG_FILE);
const demoNames = demos.map(item => decamelize(item.name, '-'));
config.nav = config.nav.filter((group: any) => {
CONFIG.site.nav = CONFIG.site.nav.filter((group: any) => {
group.items = group.items.filter((item: any) => (demoNames.includes(item.path)));
return group.items.length;
});
return `export const config = ${JSON.stringify(config, null, 2)}`;
return `export const config = ${JSON.stringify(CONFIG, null, 2)}`;
}
function genCode(components: string[]) {

View File

@ -1,15 +1,21 @@
import { get } from 'lodash';
import { join, relative } from 'path';
import { writeFileSync } from 'fs-extra';
import { pascalize, getComponents } from '../common';
import { pascalize, getComponents, replaceExt } from '../common';
import {
CONFIG,
SRC_DIR,
DIST_DIR,
PACKAGE_JSON_FILE,
PACKAGE_ENTRY_FILE
PACKAGE_ENTRY_FILE,
PACKAGE_STYLE_FILE,
STYPE_DEPS_JSON_FILE
} from '../common/constant';
// eslint-disable-next-line
const packageJson = require(PACKAGE_JSON_FILE);
// eslint-disable-next-line
const styleDepsJson = require(STYPE_DEPS_JSON_FILE);
const version = process.env.PACKAGE_VERSION || packageJson.version;
function genImports(components: string[]): string {
@ -25,7 +31,26 @@ function genExports(names: string[]): string {
return names.map(name => `${name}`).join(',\n ');
}
export function genPackageEntry() {
function getStyleExt(): string {
const preprocessor = get(CONFIG, 'build.css.preprocessor', 'less');
if (preprocessor === 'sass') {
return '.scss';
}
return `.${preprocessor}`;
}
function genStyleEntry() {
const ext = getStyleExt();
const content = styleDepsJson.sequence
.map((item: string) => `@import "./${item}/index${ext}";`)
.join('\n');
writeFileSync(replaceExt(PACKAGE_STYLE_FILE, ext), content);
}
function genScriptEntry() {
const components = getComponents();
const names = components.map(item => pascalize(item));
@ -64,3 +89,8 @@ export default {
writeFileSync(PACKAGE_ENTRY_FILE, content);
}
export function genPackageEntry() {
genStyleEntry();
genScriptEntry();
}

View File

@ -1,11 +1,9 @@
import merge from 'webpack-merge';
import { baseConfig } from './webpack.base';
import { getWebpackConfig } from '../common';
import { LIB_DIR, CONFIG_FILE, PACKAGE_ENTRY_FILE } from '../common/constant';
import { LIB_DIR, CONFIG, PACKAGE_ENTRY_FILE } from '../common/constant';
// eslint-disable-next-line
const config = require(CONFIG_FILE);
const { name } = config;
const { name } = CONFIG;
export function packageConfig(isMinify: boolean) {
return merge(

View File

@ -2,12 +2,11 @@ import merge from 'webpack-merge';
import HtmlWebpackPlugin from 'html-webpack-plugin';
import { join } from 'path';
import { baseConfig } from './webpack.base';
import { CONFIG_FILE, MOBILE_ENTRY_FILE, DESKTOP_ENTRY_FILE } from '../common/constant';
import { CONFIG, MOBILE_ENTRY_FILE, DESKTOP_ENTRY_FILE } from '../common/constant';
import { getWebpackConfig } from '../common';
// eslint-disable-next-line
const config = require(CONFIG_FILE);
const title = `${config.title} - ${config.description}`;
const siteConfig = CONFIG.site;
const title = `${siteConfig.title} - ${siteConfig.description}`;
export const siteDevConfig = merge(
baseConfig as any,
@ -48,14 +47,14 @@ export const siteDevConfig = merge(
plugins: [
new HtmlWebpackPlugin({
title,
logo: config.logo,
logo: siteConfig.logo,
chunks: ['chunks', 'site-desktop'],
template: join(__dirname, '../../site/desktop/index.html'),
filename: 'index.html'
}),
new HtmlWebpackPlugin({
title,
logo: config.logo,
logo: siteConfig.logo,
chunks: ['chunks', 'site-mobile'],
template: join(__dirname, '../../site/mobile/index.html'),
filename: 'mobile.html'

View File

@ -1221,6 +1221,11 @@
resolved "https://registry.npm.taobao.org/@types/less/download/@types/less-3.0.1.tgz#625694093c72f8356c4042754e222407e50d6b08"
integrity sha1-YlaUCTxy+DVsQEJ1TiIkB+UNawg=
"@types/lodash@^4.14.149":
version "4.14.149"
resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.149.tgz#1342d63d948c6062838fbf961012f74d4e638440"
integrity sha512-ijGqzZt/b7BfzcK9vTrS6MFljQRPn5BFWOx8oE0GYxribu6uV+aA9zZuXI1zc/etK9E8nrgdoF2+LgUw7+9tJQ==
"@types/mime@*":
version "2.0.1"
resolved "https://registry.npm.taobao.org/@types/mime/download/@types/mime-2.0.1.tgz#dc488842312a7f075149312905b5e3c0b054c79d"