{{ Object.keys(props) }}
From TSssss: {{ a?.toFixed(2) }}
diff --git a/example/devServer.js b/example/devServer.js new file mode 100644 index 000000000..04cbb9bf2 --- /dev/null +++ b/example/devServer.js @@ -0,0 +1,17 @@ +// register proxy sub-paths +if (process.env.WEBPACK4) { + console.log('using webpack 4...') + const Module = require('module') + const resolve = Module._resolveFilename + Module._resolveFilename = (request, ...rest) => { + if (request === 'webpack') { + return resolve('webpack4', ...rest) + } + if (request.startsWith('webpack/')) { + return resolve(request.replace(/^webpack\//, 'webpack4/'), ...rest) + } + return resolve(request, ...rest) + } +} + +require('webpack-dev-server/bin/webpack-dev-server.js') diff --git a/example/tsconfig.json b/example/tsconfig.json deleted file mode 100644 index f27872932..000000000 --- a/example/tsconfig.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "compilerOptions": { - "allowJs": true, - "sourceMap": true - } -} \ No newline at end of file diff --git a/example/types.ts b/example/types.ts new file mode 100644 index 000000000..1de15a3db --- /dev/null +++ b/example/types.ts @@ -0,0 +1,4 @@ +export interface Props { + msg: string + lol?: string +} diff --git a/example/webpack.config.js b/example/webpack.config.js index a384fabd3..c240ad021 100644 --- a/example/webpack.config.js +++ b/example/webpack.config.js @@ -1,7 +1,5 @@ -const fs = require('fs') const path = require('path') const webpack = require('webpack') -const hash = require('hash-sum') const VueLoaderPlugin = require('../dist/plugin').default const MiniCssExtractPlugin = require('mini-css-extract-plugin') @@ -22,13 +20,20 @@ module.exports = (env = {}) => { */ const genConfig = (isServerBuild = false) => { const minimize = isProd && !isServerBuild && !env.noMinimize - const useBabel = isProd && !isServerBuild && !env.noBabel return { mode: isProd ? 'production' : 'development', entry: path.resolve(__dirname, './main.js'), target: isServerBuild ? 'node' : 'web', devtool: 'source-map', + resolve: { + extensions: ['.js', '.ts'], + alias: process.env.WEBPACK4 + ? { + webpack: 'webpack4', + } + : {}, + }, output: { path: path.resolve( __dirname, @@ -54,7 +59,10 @@ module.exports = (env = {}) => { test: /\.vue$/, loader: 'vue-loader', options: { - reactivityTransform: true, + // reactivityTransform: true, + compilerOptions: { + isCustomElement: (tag) => tag.startsWith('custom-'), + }, }, }, { @@ -70,56 +78,17 @@ module.exports = (env = {}) => { }, { test: /\.css$/, - use: [ - { - loader: MiniCssExtractPlugin.loader, - options: { - hmr: !isProd, - }, - }, - 'css-loader', - ], + use: [MiniCssExtractPlugin.loader, 'css-loader'], }, - // { - // test: /\.js$/, - // use: [ - // { - // loader: 'cache-loader', - // options: { - // cacheIdentifier: hash( - // // deps - // fs.readFileSync( - // path.resolve(__dirname, '../package.json') - // ) + - // // env - // JSON.stringify(env) + - // // client vs. server build - // isServerBuild - // ), - // cacheDirectory: path.resolve(__dirname, '../.cache'), - // }, - // }, - // ...(useBabel - // ? [ - // { - // loader: 'babel-loader', - // options: { - // // use yarn build-example --env.noMinimize to verify that - // // babel is properly applied to all js code, including the - // // render function compiled from SFC templates. - // presets: ['@babel/preset-env'], - // }, - // }, - // ] - // : []), - // ], - // }, { test: /\.ts$/, use: [ { - loader: 'ts-loader', + loader: process.env.WEBPACK4 + ? require.resolve('ts-loader') + : require.resolve('ts-loader-v9'), options: { + transpileOnly: true, appendTsSuffixTo: [/\.vue$/], }, }, @@ -141,12 +110,14 @@ module.exports = (env = {}) => { __IS_SSR__: !!isSSR, __VUE_OPTIONS_API__: true, __VUE_PROD_DEVTOOLS__: false, + __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: false, }), ], optimization: { minimize, }, devServer: { + hot: true, stats: 'minimal', contentBase: __dirname, overlay: true, diff --git a/jest.config.js b/jest.config.js index 3a81a10f3..fc6d1b325 100644 --- a/jest.config.js +++ b/jest.config.js @@ -1,24 +1,27 @@ -const config = { +const isWebpack4 = process.env.WEBPACK4 + +console.log( + `running tests with webpack ${isWebpack4 ? '4' : '5'}${ + !isWebpack4 && process.env.INLINE_MATCH_RESOURCE + ? ' with inline match resource enabled' + : '' + }...` +) + +module.exports = { preset: 'ts-jest', testTimeout: 60000, testEnvironment: 'node', testPathIgnorePatterns: ['hi
-yo
- -hi
+yo
+ +