sysgears / larix Goto Github PK
View Code? Open in Web Editor NEWLarix Meta Framework - a polyglot ecosystem for creating modular software with trivially addable and removable feature modules
License: MIT License
larix's Issues
openBrowser option not working
After frontend code build, open browser not working anymore in the latest release.
zen.js config
const config = {
builders: {
web: {
entry: './src/index.tsx',
output: {
chunkFilename: '[name].bundle.js',
},
stack: ['web', 'react'],
tsLoaderOptions: {
configFileName: "./tsconfig.json"
},
webpackDevPort: 3000,
openBrowser: true,
defines: {
__CLIENT__: true,
},
test: {
role: ['build', 'watch']
},
htmlTemplate: "../../tools/html-plugin-template.ejs",
// Wait for backend to start prior to letting webpack load frontend page
waitOn: ['tcp:localhost:8080'],
enabled: true,
webpackConfig: {
plugins: [
new LodashModuleReplacementPlugin
],
// for additional webpack configuration.
resolve: process.env.NODE_ENV !== 'production'
? {
alias: {
'react-dom': '@hot-loader/react-dom'
}
}
: {},
}
},
server: {
entry: './src/backend/app.ts',
stack: ['server'],
tsLoaderOptions: {
configFileName: "./tsconfig.json"
},
defines: {
__SERVER__: true,
},
enabled: false,
webpackConfig: {
output: {
filename: 'main.js',
},
plugins: [
new CopyWebpackPlugin([{
from: '../../tools/esm-wrapper.js',
to: 'index.js',
}]),
new LodashModuleReplacementPlugin
],
externals: [
nodeExternals(),
nodeExternals({ whitelist: [/webpack\/hot/i, /babel-polyfill/], modulesDir: "../../node_modules" })
],
}
},
test: {
stack: ['server'],
roles: ['test'],
defines: {
__TEST__: true
}
}
},
options: {
stack: [
"apollo",
"ts",
"react",
"webpack",
"css"
],
cache: '../../.cache',
backendBuildDir: "dist",
frontendBuildDir: "dist",
dllBuildDir: "dist/.build/dll",
ssr: false,
backendUrl: "http://localhost:8080",
webpackDll: true,
reactHotLoader: true,
useDefaultPostCss: true,
persistGraphQL: false,
frontendRefreshOnBackendChange: true,
nodeDebugger: false,
overridesConfig: "./tools/webpackAppConfig.js",
plugins: [
new Dotenv({
path: process.env.ENV_FILE
})
],
defines: {
__DEV__: process.env.NODE_ENV === 'development',
__GRAPHQL_URL__: '"http://localhost:8080/graphql"',
}
}
};
webpack config
en debug Zen Config:
{ '[web]':
{ entry: './src/index.tsx',
output: { chunkFilename: '[name].bundle.js' },
stack:
Stack {
technologies: [ 'apollo', 'ts', 'react', 'webpack', 'css', 'web' ],
platform: 'web' },
tsLoaderOptions: { configFileName: './tsconfig.json' },
webpackDevPort: 3000,
openBrowser: true,
defines:
{ __DEV__: true,
__GRAPHQL_URL__: '"http://localhost:8080/graphql"',
__SSR__: false,
__PERSIST_GQL__: '\'false\'',
__FRONTEND_BUILD_DIR__: '\'dist\'',
__DLL_BUILD_DIR__: '\'dist/.build/dll\'',
__DEBUGGING__: '\'false\'',
__CLIENT__: true },
test: { role: [ 'build', 'watch' ] },
htmlTemplate: '../../tools/html-plugin-template.ejs',
waitOn: [ 'tcp:localhost:8080' ],
enabled: true,
webpackConfig:
{ plugins:
[ DefinePlugin {
definitions:
{ 'process.env.NATS_URL': '"nats://localhost:4222/"',
'process.env.NATS_USER': '"test"',
'process.env.NATS_PW': '"test"',
'process.env.GRAPHQL_URL': '"http://localhost:8080/graphql"',
'process.env.CLIENT_URL': '"http://localhost:3000"',
'process.env.ZIPKIN_URL': '"test"',
'process.env.ZIPKIN_PORT': '"test"',
'process.env.LOG_LEVEL': '"trace"' } },
DefinePlugin {
definitions:
{ __ENV__:
'{"NATS_URL":"nats://localhost:4222/","NATS_USER":"test","NATS_PW":"test","GRAPHQL_URL":"http://localhost:8080/graphql","CLIENT_URL":"http://localhost:3000","ZIPKIN_URL":"test","ZIPKIN_PORT":"test","LOG_LEVEL":"trace"}' } } ] },
name: 'web',
require:
{ [Function: require]
resolve: [Function],
probe: [Function],
cwd:
'/Users/projects/fullstack-pro/servers/frontend-server' },
plugins:
[ WebpackPlugin {},
WebAssetsPlugin {},
CssProcessorPlugin {},
ApolloPlugin {},
TypeScriptPlugin {},
BabelPlugin {},
ReactPlugin {},
TCombPlugin {},
FlowRuntimePLugin {},
ReactNativePlugin {},
ReactNativeWebPlugin {},
StyledComponentsPlugin {},
AngularPlugin {},
VuePlugin {},
I18NextPlugin {},
VuePlugin {},
ReactHotLoaderPlugin {} ],
roles: [ 'build', 'watch' ],
cache: '../../.cache',
backendBuildDir: 'dist',
frontendBuildDir: 'dist',
dllBuildDir: 'dist/.build/dll',
ssr: false,
backendUrl: 'http://localhost:8080',
webpackDll: true,
reactHotLoader: true,
useDefaultPostCss: true,
persistGraphQL: false,
frontendRefreshOnBackendChange: true,
nodeDebugger: false,
overridesConfig: './tools/webpackAppConfig.js',
devProxy: false,
id: '[web]',
configPath:
'/Users/projects/fullstack-pro/servers/frontend-server/.zenrc.js',
buildDir: undefined,
sourceMap: true,
minify: true },
'[server]':
{ entry: './src/backend/app.ts',
stack:
Stack {
technologies: [ 'apollo', 'ts', 'react', 'webpack', 'css', 'server' ],
platform: 'server' },
tsLoaderOptions: { configFileName: './tsconfig.json' },
defines:
{ __DEV__: true,
__GRAPHQL_URL__: '"http://localhost:8080/graphql"',
__SSR__: false,
__PERSIST_GQL__: '\'false\'',
__FRONTEND_BUILD_DIR__: '\'dist\'',
__DLL_BUILD_DIR__: '\'dist/.build/dll\'',
__DEBUGGING__: '\'false\'',
__SERVER__: true },
enabled: false,
webpackConfig:
{ output: { filename: 'main.js' },
plugins:
[ CopyPlugin {
patterns: [ { from: '../../tools/esm-wrapper.js', to: 'index.js' } ],
options: {} },
LodashModuleReplacementPlugin {
matches: [],
options: {},
patterns:
[ [ '_baseIndexOf', '_strictIndexOf' ],
[ '_cacheHas', '_arrayIncludes' ],
[ '_createSet', 'noop' ],
[ '_MapCache', '_ListCache' ],
[ '_SetCache', 'castArray' ],
[ '_Stack', '_ListCache' ],
[ '_getFuncName', 'stubString' ],
[ '_isLaziable', 'stubFalse' ],
[ '_LodashWrapper', 'noop' ],
[ '_baseClone', 'identity' ],
[ '_baseToNumber', 'identity' ],
[ '_baseToString', 'identity' ],
[ '_toKey', 'identity' ],
[ 'toFinite', 'identity' ],
[ 'toInteger', 'identity' ],
[ 'toLength', 'identity' ],
[ 'toNumber', 'identity' ],
[ 'toString', 'identity' ],
[ '_baseAggregator', '_arrayAggregator' ],
[ '_baseFilter', '_arrayFilter' ],
[ '_baseMap', '_arrayMap' ],
[ 'each', '_arrayEach' ],
[ 'eachRight', '_arrayEachRight' ],
[ 'every', '_arrayEvery' ],
[ 'filter', '_arrayFilter' ],
[ 'forEach', '_arrayEach' ],
[ 'forEachRight', '_arrayEachRight' ],
[ 'includes', '_arrayIncludes' ],
[ 'map', '_arrayMap' ],
[ 'reduce', '_arrayReduce' ],
[ 'reduceRight', '_arrayReduceRight' ],
[ 'sample', '_arraySample' ],
[ 'sampleSize', '_arraySampleSize' ],
[ 'shuffle', '_arrayShuffle' ],
[ 'some', '_arraySome' ],
[ '_createWrap', '_createPartial' ],
[ 'unary', '_baseUnary' ],
[ 'deburr', 'identity' ],
[ '_baseGetTag', '_objectToString' ],
[ '_equalByTag', 'eq' ],
[ '_getAllKeys', '_nativeKeys' ],
[ '_getAllKeysIn', '_nativeKeysIn' ],
[ '_getSymbols', 'stubArray' ],
[ '_getSymbolsIn', 'stubArray' ],
[ '_getTag', '_objectToString' ],
[ '_initCloneByTag', 'identity' ],
[ '_mapToArray', 'stubArray' ],
[ '_setToArray', 'stubArray' ],
[ '_setToPairs', 'stubArray' ],
[ 'isArguments', 'stubFalse' ],
[ 'isArrayBuffer', 'baseIsArrayBuffer' ],
[ 'isBuffer', 'stubFalse' ],
[ 'isDate', 'baseIsDate' ],
[ 'isMap', 'stubFalse' ],
[ 'isRegExp', 'baseIsRegExp' ],
[ 'isSet', 'stubFalse' ],
[ 'isSymbol', 'stubFalse' ],
[ 'isTypedArray', 'stubFalse' ],
[ '_baseFlatten', 'head' ],
[ '_flatRest', 'identity' ],
[ '_getNative', '_getValue' ],
[ '_getRawTag', '_objectToString' ],
[ '_isIterateeCall', 'stubFalse' ],
[ '_isPrototype', 'stubFalse' ],
[ '_baseKeys', '_nativeKeys' ],
[ '_baseKeysIn', '_nativeKeysIn' ],
[ '_castFunction', 'identity' ],
[ '_castRest', 'identity' ],
[ '_shortOut', 'identity' ],
[ 'isNaN', 'baseIsNaN' ],
[ 'isNative', 'stubTrue' ],
[ 'keys', '_nativeKeys' ],
[ 'keysIn', '_nativeKeysIn' ],
[ 'times', '_baseTimes' ],
[ '_memoizeCapped', 'identity' ],
[ 'memoize', 'identity' ],
[ '_baseSetData', 'identity' ],
[ '_getData', 'noop' ],
[ '_mergeData', 'identity' ],
[ '_setData', 'identity' ],
[ '_setToString', 'identity' ],
[ '_setWrapToString', 'identity' ],
[ '_baseGet', '_getValue' ],
[ '_castPath', 'castArray' ],
[ '_isKey', 'identity' ],
[ '_parent', 'identity' ],
[ 'has', '_baseHas' ],
[ 'hasIn', '_baseHasIn' ],
[ 'property', '_baseProperty' ],
[ 'propertyOf', '_basePropertyOf' ],
[ '_getHolder', 'noop' ],
[ '_replaceHolders', 'stubArray' ],
[ '_baseIteratee', 'identity' ],
[ '_hasUnicode', 'stubFalse' ],
[ '_hasUnicodeWord', 'stubFalse' ],
[ '_unicodeSize', '_asciiSize' ],
[ '_unicodeToArray', '_asciiToArray' ],
[ '_unicodeWords', '_asciiWords' ],
[ 'stringSize', '_asciiSize' ],
[ 'stringToArray', '_asciiToArray' ] ],
resolve: [Function: bound resolve] } ],
externals: [ [Function], [Function] ] },
name: 'server',
require:
{ [Function: require]
resolve: [Function],
probe: [Function],
cwd:
'/Users/projects/fullstack-pro/servers/frontend-server' },
plugins:
[ WebpackPlugin {},
WebAssetsPlugin {},
CssProcessorPlugin {},
ApolloPlugin {},
TypeScriptPlugin {},
BabelPlugin {},
ReactPlugin {},
TCombPlugin {},
FlowRuntimePLugin {},
ReactNativePlugin {},
ReactNativeWebPlugin {},
StyledComponentsPlugin {},
AngularPlugin {},
VuePlugin {},
I18NextPlugin {},
VuePlugin {},
ReactHotLoaderPlugin {} ],
roles: [ 'build', 'watch' ],
cache: '../../.cache',
backendBuildDir: 'dist',
frontendBuildDir: 'dist',
dllBuildDir: 'dist/.build/dll',
ssr: false,
backendUrl: 'http://localhost:8080',
webpackDll: true,
reactHotLoader: true,
useDefaultPostCss: true,
persistGraphQL: false,
frontendRefreshOnBackendChange: true,
nodeDebugger: false,
overridesConfig: './tools/webpackAppConfig.js',
devProxy: false,
id: '[server]',
configPath:
'/Users/projects/fullstack-pro/servers/frontend-server/.zenrc.js',
buildDir: undefined,
sourceMap: true,
minify: true },
'[test]':
{ stack:
Stack {
technologies: [ 'apollo', 'ts', 'react', 'webpack', 'css', 'server' ],
platform: 'server' },
roles: [ 'test' ],
defines:
{ __DEV__: true,
__GRAPHQL_URL__: '"http://localhost:8080/graphql"',
__SSR__: false,
__PERSIST_GQL__: '\'false\'',
__FRONTEND_BUILD_DIR__: '\'dist\'',
__DLL_BUILD_DIR__: '\'dist/.build/dll\'',
__DEBUGGING__: '\'false\'',
__TEST__: true },
name: 'test',
require:
{ [Function: require]
resolve: [Function],
probe: [Function],
cwd:
'/Users/projects/fullstack-pro/servers/frontend-server' },
plugins:
[ WebpackPlugin {},
WebAssetsPlugin {},
CssProcessorPlugin {},
ApolloPlugin {},
TypeScriptPlugin {},
BabelPlugin {},
ReactPlugin {},
TCombPlugin {},
FlowRuntimePLugin {},
ReactNativePlugin {},
ReactNativeWebPlugin {},
StyledComponentsPlugin {},
AngularPlugin {},
VuePlugin {},
I18NextPlugin {},
VuePlugin {},
ReactHotLoaderPlugin {} ],
cache: '../../.cache',
backendBuildDir: 'dist',
frontendBuildDir: 'dist',
dllBuildDir: 'dist/.build/dll',
ssr: false,
backendUrl: 'http://localhost:8080',
webpackDll: true,
reactHotLoader: true,
useDefaultPostCss: true,
persistGraphQL: false,
frontendRefreshOnBackendChange: true,
nodeDebugger: false,
overridesConfig: './tools/webpackAppConfig.js',
devProxy: false,
id: '[test]',
configPath:
'/Users/projects/fullstack-pro/servers/frontend-server/.zenrc.js',
buildDir: undefined,
sourceMap: true,
minify: true } }
zen info Version 0.1.34
zen debug [webDll] = { name: 'webDll',
module:
{ rules:
[ { test: /\.mjs$/,
include: /node_modules/,
type: 'javascript/auto' },
{ test: /\.css$/,
exclude: [Function: exclude],
use:
[ { loader: 'style-loader', options: {} },
{ loader: 'css-loader',
options: { sourceMap: true, importLoaders: 1 } },
{ loader: 'postcss-loader',
options: { plugins: [Function: plugins], sourceMap: true } } ] },
{ test: /\.css$/,
exclude: [Function: exclude],
use:
[ { loader: 'style-loader', options: {} },
{ loader: 'css-loader',
options: { sourceMap: true, importLoaders: 1 } } ] },
{ test: /\.ts$/,
exclude: [Function: exclude],
use:
[ { loader: 'awesome-typescript-loader',
options: { configFileName: './tsconfig.json', useCache: true } } ] } ] },
resolve:
{ symlinks: false,
cacheWithContext: false,
extensions: [ '.mjs', '.js', '.ts', '.json' ] },
watchOptions: { ignored: /(?:)/ },
bail: true,
stats:
{ hash: false,
version: false,
timings: true,
assets: false,
chunks: false,
modules: false,
reasons: false,
children: false,
source: true,
errors: true,
errorDetails: true,
warnings: true,
publicPath: false,
colors: true },
output:
{ devtoolModuleFilenameTemplate: [Function],
pathinfo: false,
filename: 'vendor_sampleStackFrontendServerWeb_[hash]_dll.js',
path:
'/Users/projects/fullstack-pro/servers/frontend-server/dist/.build/dll',
library: 'vendor_sampleStackFrontendServerWeb' },
devtool: '#cheap-module-source-map',
mode: 'development',
performance: { hints: false },
plugins:
[ DefinePlugin {
definitions:
{ 'process.env.NODE_ENV': '"development"',
__BACKEND_URL__: '\'http://localhost:8080\'',
__DEV__: true,
__GRAPHQL_URL__: '"http://localhost:8080/graphql"',
__SSR__: false,
__PERSIST_GQL__: '\'false\'',
__FRONTEND_BUILD_DIR__: '\'dist\'',
__DLL_BUILD_DIR__: '\'dist/.build/dll\'',
__DEBUGGING__: '\'false\'',
__CLIENT__: true } },
DllPlugin {
options:
{ name: 'vendor_sampleStackFrontendServerWeb',
path:
'dist/.build/dll/vendor_sampleStackFrontendServerWeb_dll.json' } },
CheckerPlugin {},
DefinePlugin {
definitions:
{ 'process.env.NATS_URL': '"nats://localhost:4222/"',
'process.env.NATS_USER': '"test"',
'process.env.NATS_PW': '"test"',
'process.env.GRAPHQL_URL': '"http://localhost:8080/graphql"',
'process.env.CLIENT_URL': '"http://localhost:3000"',
'process.env.ZIPKIN_URL': '"test"',
'process.env.ZIPKIN_PORT': '"test"',
'process.env.LOG_LEVEL': '"trace"' } },
DefinePlugin {
definitions:
{ __ENV__:
'{"NATS_URL":"nats://localhost:4222/","NATS_USER":"test","NATS_PW":"test","GRAPHQL_URL":"http://localhost:8080/graphql","CLIENT_URL":"http://localhost:3000","ZIPKIN_URL":"test","ZIPKIN_PORT":"test","LOG_LEVEL":"trace"}' } } ],
node:
{ __dirname: true,
__filename: true,
fs: 'empty',
net: 'empty',
tls: 'empty' },
optimization:
{ removeAvailableModules: false,
removeEmptyChunks: false,
splitChunks: false },
entry:
{ vendor:
[ '@cdm-logger/client',
'@common-stack/client-core',
'@common-stack/client-react',
'@common-stack/core',
'@common-stack/server-core',
'apollo-cache-inmemory',
'apollo-client',
'apollo-fetch',
'apollo-link',
'apollo-link-batch-http',
'apollo-link-context',
'apollo-link-debounce',
'apollo-link-error',
'apollo-link-http',
'apollo-link-logger',
'apollo-link-retry',
'apollo-link-schema',
'apollo-link-ws',
'apollo-logger',
'browser-bunyan',
'classnames',
'connected-react-router',
'cors',
'dotenv',
'envalid',
'error-stack-parser',
'esm',
'fela',
'fela-beautifier',
'fela-dom',
'fela-font-renderer',
'fela-perf',
'fela-plugin-fallback-value',
'fela-plugin-logger',
'fela-plugin-lvha',
'fela-plugin-prefixer',
'fela-plugin-unit',
'fela-plugin-validator',
'fela-preset-web',
'graphql',
'graphql-tag',
'history',
'immutability-helper',
'js-cookie',
'lodash',
'ramda',
'react',
'react-apollo',
'react-dom',
'react-fela',
'react-helmet',
'react-loadable',
'react-redux',
'react-resizable',
'react-router',
'react-router-config',
'react-router-dom',
'react-router-redux',
'react-transition-group',
'redux',
'redux-logger',
'redux-observable',
'redux-persist',
'redux-thunk',
'reselect',
'rxjs',
'rxjs-compat',
'sourcemapped-stacktrace',
'subscriptions-transport-ws',
'universal-cookie-express',
'webpack-dev-server/client' ] } }
zen debug [web] = { entry:
{ index:
[ 'raf/polyfill',
'webpack/hot/dev-server',
'webpack-dev-server/client?http://localhost:3000/',
'./src/index.tsx' ] },
name: 'web',
module:
{ rules:
[ { test: /\.mjs$/,
include: /node_modules/,
type: 'javascript/auto' },
{ test: /\.(png|ico|jpg|gif|xml)$/,
use:
{ loader: 'url-loader',
options: { name: '[hash].[ext]', limit: 100000 } } },
{ test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
use:
{ loader: 'url-loader',
options: { name: '[hash].[ext]', limit: 100000 } } },
{ test: /\.(otf|ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
use: { loader: 'file-loader', options: { name: '[hash].[ext]' } } },
{ test: /\.css$/,
exclude: [Function: exclude],
use:
[ { loader: 'style-loader', options: {} },
{ loader: 'css-loader',
options: { sourceMap: true, importLoaders: 1 } },
{ loader: 'postcss-loader',
options: { plugins: [Function: plugins], sourceMap: true } } ] },
{ test: /\.css$/,
exclude: [Function: exclude],
use:
[ { loader: 'style-loader', options: {} },
{ loader: 'css-loader',
options: { sourceMap: true, importLoaders: 1 } } ] },
{ test: /\.graphqls/,
use: { loader: 'raw-loader', options: {} } },
{ test: /\.(graphql|gql)$/,
use: [ { loader: 'graphql-tag/loader', options: {} } ] },
{ test: /\.tsx?$/,
exclude: [Function: exclude],
use:
[ { loader: 'awesome-typescript-loader',
options: { configFileName: './tsconfig.json', useCache: true } } ] } ],
unsafeCache: false },
resolve:
{ symlinks: false,
cacheWithContext: false,
unsafeCache: false,
extensions:
[ '.web.mjs',
'.web.js',
'.web.ts',
'.web.tsx',
'.mjs',
'.js',
'.ts',
'.tsx',
'.json' ] },
watchOptions: { ignored: /(?:)/ },
bail: false,
stats:
{ hash: false,
version: false,
timings: true,
assets: false,
chunks: false,
modules: false,
reasons: false,
children: false,
source: true,
errors: true,
errorDetails: true,
warnings: true,
publicPath: false,
colors: true },
output:
{ devtoolModuleFilenameTemplate: [Function],
pathinfo: false,
filename: '[name].[hash].js',
chunkFilename: '[name].[chunkhash].js',
path:
'/Users/projects/fullstack-pro/servers/frontend-server/dist/web',
publicPath: '/' },
devtool: '#cheap-module-source-map',
mode: 'development',
performance: { hints: false },
plugins:
[ HotModuleReplacementPlugin {
options: {},
multiStep: undefined,
fullBuildTimeout: 200,
requestTimeout: 10000 },
DefinePlugin {
definitions:
{ __CLIENT__: true,
__SERVER__: false,
__SSR__: false,
__DEV__: true,
__TEST__: false,
'process.env.NODE_ENV': '"development"',
__BACKEND_URL__: '\'http://localhost:8080\'',
__GRAPHQL_URL__: '"http://localhost:8080/graphql"',
__PERSIST_GQL__: '\'false\'',
__FRONTEND_BUILD_DIR__: '\'dist\'',
__DLL_BUILD_DIR__: '\'dist/.build/dll\'',
__DEBUGGING__: '\'false\'' } },
ManifestPlugin {
opts:
{ publicPath: null,
basePath: '',
fileName: 'assets.json',
transformExtensions: /^(gz|map)$/i,
writeToFileEmit: false,
seed: null,
filter: null,
map: null,
generate: null,
sort: null,
serialize: [Function: serialize] } },
HtmlWebpackPlugin {
options:
{ template: '../../tools/html-plugin-template.ejs',
templateParameters: [Function: templateParametersGenerator],
filename: 'index.html',
hash: false,
inject: 'body',
compile: true,
favicon: false,
minify: false,
cache: true,
showErrors: true,
chunks: 'all',
excludeChunks: [],
chunksSortMode: 'auto',
meta: {},
title: 'Webpack App',
xhtml: false } },
DefinePlugin { definitions: { __PERSIST_GQL__: false } },
VirtualModulesPlugin {
_staticModules:
{ '/Users/projects/fullstack-pro/servers/frontend-server/node_modules/persisted_queries.json': '{}' } },
CheckerPlugin {},
DefinePlugin {
definitions:
{ 'process.env.NATS_URL': '"nats://localhost:4222/"',
'process.env.NATS_USER': '"test"',
'process.env.NATS_PW': '"test"',
'process.env.GRAPHQL_URL': '"http://localhost:8080/graphql"',
'process.env.CLIENT_URL': '"http://localhost:3000"',
'process.env.ZIPKIN_URL': '"test"',
'process.env.ZIPKIN_PORT': '"test"',
'process.env.LOG_LEVEL': '"trace"' } },
DefinePlugin {
definitions:
{ __ENV__:
'{"NATS_URL":"nats://localhost:4222/","NATS_USER":"test","NATS_PW":"test","GRAPHQL_URL":"http://localhost:8080/graphql","CLIENT_URL":"http://localhost:3000","ZIPKIN_URL":"test","ZIPKIN_PORT":"test","LOG_LEVEL":"trace"}' } } ],
node:
{ __dirname: true,
__filename: true,
fs: 'empty',
net: 'empty',
tls: 'empty' },
optimization:
{ removeAvailableModules: false,
removeEmptyChunks: false,
splitChunks: false },
devServer:
{ hot: true,
publicPath: '/',
headers: { 'Access-Control-Allow-Origin': '*' },
open: true,
quiet: false,
noInfo: true,
historyApiFallback: true,
port: 3000 } }
[zen]Error: Cannot find module '../../../.pnp.js'
Getting the following error with the latest version. Seems to be a build or npm packaging issue.
> zen watch
internal/modules/cjs/loader.js:584
throw err;
^
Error: Cannot find module '../../../.pnp.js'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:582:15)
at Function.Module._load (internal/modules/cjs/loader.js:508:25)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:22:18)
at Object.<anonymous> (/Users//fullstack-pro/node_modules/@larix/zen/src/boot-dev.js:1:63)
at Module._compile (internal/modules/cjs/loader.js:701:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
at Module.load (internal/modules/cjs/loader.js:600:32)
at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
at Function.Module._load (internal/modules/cjs/loader.js:531:3)
when build fails, it throws error but process do not exit
When a build fails especially on frontend, we see it throws an error but process don't exit. Due to it the build just hangs instead of exiting.
server-webpack error ModuleNotFoundError: Module not found: Error: Can't resolve 'apollo-link-scalar' in '/Users/fullstack-pro/servers/frontend-server/src/modules'
at factory.create (/Users/fullstack-pro/node_modules/webpack/lib/Compilation.js:925:10)
The fix I have found that work is by replacing this line https://github.com/sysgears/larix/blob/master/packages/zen/src/executor.ts#L121 with process.exit(1). Let me know if you want me to send PR.
[DEP0091] DeprecationWarning: crypto
Seeing some Deprecation warning from crypto library used here.
There are few fixes to get rid of this warnings as per this note. nodejs/node#23203 (comment)
latest version fails
After the recent PR we getting following errors
Error: Cannot find module '../../../.pnp.js'
Require stack:
- /Users/common/fullstack-pro/node_modules/@larix/zen/src/boot-dev.js
- /Users/common/fullstack-pro/node_modules/@larix/zen/src/boot-cli-dev.js
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:815:15)
at Function.Module._load (internal/modules/cjs/loader.js:667:27)
at Module.require (internal/modules/cjs/loader.js:887:19)
at require (internal/modules/cjs/helpers.js:74:18)
at Object.<anonymous> (/Users/veeramarni/common/fullstack-pro/node_modules/@larix/zen/src/boot-dev.js:1:1)
WARNING in Conflict: Multiple assets emit different content to the same filename index.f612673c059cbe9d86c9.js.map
When hot module renders the changes it shows the following warning with latest webpack.
WARNING in Conflict: Multiple assets emit different content to the same filename index.f612673c059cbe9d86c9.js.map
The fix would be as shown in webpack/webpack#9732 (comment)
'[file].map[query]' for SourceMapDevToolPlugin
found issue with latest clean-webpack-plugin
With the latest clean-webpack-plugin v3, we get the following error. I will create a PR shortly.
zen error TypeError: CleanWebpackPlugin is not a constructor
at createPlugins (/Users/projects/IDE/fullstack-pro/node_modules/@larix/zen/src/plugins/WebpackPlugin.ts:75:30)
False positive?
My stack has 'webpack' in it, but errors out saying it doesn't.
zen error Error: builder 'web' stack does not include 'webpack'. Consider let zen guess your stack by removing 'stack' propery.
const config = {
builders: {
server: {
stack: ['server', 'webpack', 'es5', 'js', 'ts', 'apollo', 'react'],
openBrowser: true,
entry: './src/index.ts'
}
},
options: {
ssr: true,
webpackDll: true,
reactHotLoader: true,
webpackConfig: {
devServer: {
disableHostCheck: true
}
}
}
}
module.exports = config
Cannot read property 'vendor' of undefined
I cannot seem to get .zenrc.js to work. It works great without it, but I need to do some customization, I can't get past this. It's probably something simple, but I figured I'd ask at the risk of looking like a dummy. Thanks a lot for any help. Zen is awesome.
Basic config within web package.
const config = {
builders: {
web: {
stack: ['web'],
openBrowser: true
}
},
options: {
ssr: true,
webpackDll: true,
reactHotLoader: true,
webpackConfig: {
devServer: {
disableHostCheck: true
}
}
}
}
module.exports = config
Awesome-typescript-loader breaks
ts-loader works fine, but I wanted to move to awesome-typescript-loader as from what I've read it does paths better??? Anyways, I get this now. Lots of stuff in Google on this, but so far no luck. I removed ts-loader from manifest to possibly stop conflicts, but no luck there either. :)
$ zen watch -v
TypeError: Cannot read property 'parentCompilation' of undefined
at Object.getRootCompiler (Q:\PROJECTS\NOWSECURE\distillery\node_modules\awesome-typescript-loader\src\instance.ts:71:15)
Support different CleanWebpackPlugin versions
API changed with CleanWebpackPlugin v2 and v3.
Zen afaik doesn't detect versions and uses only v1 API.
Using Zen 0.1.30 with CleanWebpackPlugin 2.0.2 throws:
zen error Error: clean-webpack-plugin only accepts an options object. See: https://github.com/johnagan/clean-webpack-plugin#options-and-defaults-optional
at new CleanWebpackPlugin (.\my-project\node_modules\clean-webpack-plugin\src\clean-webpack-plugin.ts:79:19)
at createPlugins (.\my-project\node_modules\@larix\zen\src\plugins\WebpackPlugin.ts:74:30)
at createConfig (.\my-project\node_modules\@larix\zen\src\plugins\WebpackPlugin.ts:294:19)
at WebpackPlugin.configure (.\my-project\node_modules\@larix\zen\src\plugins\WebpackPlugin.ts:552:50)
at .\my-project\node_modules\@larix\zen\src\createBuilders.ts:146:62
at Array.forEach (<anonymous>)
at _loop_2 (.\my-project\node_modules\@larix\zen\src\createBuilders.ts:146:21)
at Object.createBuilders [as default] (.\my-project\node_modules\@larix\zen\lib\createBuilders.js:154:9)
at Object.<anonymous> (.\my-project\node_modules\@larix\zen\src\cli.ts:50:30)
at Module._compile (internal/modules/cjs/loader.js:777:30)
Using Zen 0.1.30 with CleanWebpackPlugin 3.0.0 throws:
zen error TypeError: CleanWebpackPlugin is not a constructor
at createPlugins (.\my-project\node_modules\@larix\zen\src\plugins\WebpackPlugin.ts:74:30)
at createConfig (.\my-project\node_modules\@larix\zen\src\plugins\WebpackPlugin.ts:294:19)
at WebpackPlugin.configure (.\my-project\node_modules\@larix\zen\src\plugins\WebpackPlugin.ts:552:50)
at .\my-project\node_modules\@larix\zen\src\createBuilders.ts:146:62
at Array.forEach (<anonymous>)
at _loop_2 (.\my-project\node_modules\@larix\zen\src\createBuilders.ts:146:21)
at Object.createBuilders [as default] (.\my-project\node_modules\@larix\zen\lib\createBuilders.js:154:9)
at Object.<anonymous> (.\my-project\node_modules\@larix\zen\src\cli.ts:50:30)
at Module._compile (internal/modules/cjs/loader.js:777:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:788:10)
Functionality to ignore folders for BuilderDiscoverer / bug report
BuilderDiscoverer seems to scan all directories recursively. There should be a functionality to ignore certain folders, as there might be:
- a huge number of files, causing performance issues
- or, in my case, a permisions issue:
> zen start
zen error Error: EACCES: permission denied, scandir '/home/manu/stuff/our-board/backend/docker/local-nextcloud/db/mysql'
at Object.readdirSync (fs.js:955:3)
at BuilderDiscoverer._discoverRecursively (/home/manu/stuff/our-board/backend/node_modules/@larix/zen/src/BuilderDiscoverer.ts:40:22)
at BuilderDiscoverer._discoverRecursively (/home/manu/stuff/our-board/backend/node_modules/@larix/zen/src/BuilderDiscoverer.ts:44:43)
at BuilderDiscoverer._discoverRecursively (/home/manu/stuff/our-board/backend/node_modules/@larix/zen/src/BuilderDiscoverer.ts:44:43)
at BuilderDiscoverer._discoverRecursively (/home/manu/stuff/our-board/backend/node_modules/@larix/zen/src/BuilderDiscoverer.ts:44:43)
at BuilderDiscoverer._discoverRecursively (/home/manu/stuff/our-board/backend/node_modules/@larix/zen/src/BuilderDiscoverer.ts:44:43)
at /home/manu/stuff/our-board/backend/node_modules/@larix/zen/src/BuilderDiscoverer.ts:25:32
at Array.reduce (<anonymous>)
at BuilderDiscoverer.discover (/home/manu/stuff/our-board/backend/node_modules/@larix/zen/src/BuilderDiscoverer.ts:24:29)
at Object.createBuilders [as default] (/home/manu/stuff/our-board/backend/node_modules/@larix/zen/src/createBuilders.ts:82:44) {
errno: -13,
syscall: 'scandir',
code: 'EACCES',
path: '/home/manu/stuff/our-board/backend/docker/local-nextcloud/db/mysql'
}
zen install raf and babel/polyfill
For serverside, we getting the below following unwanted packages. How can we skip it?
zen debug [server] = { entry:
{ index:
[ 'raf/polyfill',
'@babel/polyfill',
'webpack/hot/signal.js',
'./src/index.ts' ] },
name: 'server',
And this is our configuraiton for server
const config = {
builders: {
server: {
entry: './src/index.ts',
stack: ['server'],
tsLoaderOptions: {
"configFileName": "./tsconfig.json"
},
defines: {
__SERVER__: true
},
enabled: true,
webpackConfig: {
output: {
filename: 'main.js',
},
plugins: [
new CopyWebpackPlugin([{
from: '../../tools/esm-wrapper.js',
to: 'index.js',
}]),
],
externals: [
nodeExternals({}),
nodeExternals({ whitelist: [/webpack\/hot/i], modulesDir: "../../node_modules" })
],
}
},
test: {
stack: ['server'],
roles: ['test'],
defines: {
__TEST__: true
}
}
},
options: {
stack: [
'ts',
'webpack'
],
cache: '../../.cache',
ssr: false,
backendBuildDir: "dist",
frontendBuildDir: "dist",
dllBuildDir: "dist/.build/dll",
webpackDll: false,
reactHotLoader: false,
persistGraphQL: false,
backendUrl: "http://{ip}:8080",
frontendRefreshOnBackendChange: true,
nodeDebugger: false,
defines: {
__DEV__: process.env.NODE_ENV !== 'production',
__GRAPHQL_URL__: '"http://localhost:8080/graphql"',
},
}
};
zen generated `web` stack as well even we don't list in the stack
We seeing this issue with latest version 0.1.32. I have uploaded the log.
Script used
const url = require('url');
const path = require('path');
var nodeExternals = require('webpack-node-externals');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const config = {
builders: {
server: {
entry: './src/index.ts',
stack: ['server'],
tsLoaderOptions: {
"configFileName": "./tsconfig.json"
},
defines: {
__SERVER__: true
},
enabled: true,
webpackConfig: {
output: {
filename: 'main.js',
},
plugins: [
new CopyWebpackPlugin([{
from: '../../tools/esm-wrapper.js',
to: 'index.js',
}]),
],
externals: [
nodeExternals({}),
nodeExternals({ whitelist: [/webpack\/hot/i], modulesDir: "../../node_modules" })
],
}
},
test: {
stack: ['server'],
roles: ['test'],
defines: {
__TEST__: true
}
}
},
options: {
stack: [
'ts',
"apollo",
'webpack'
],
cache: '../../.cache',
ssr: false,
backendBuildDir: "dist",
frontendBuildDir: "dist",
dllBuildDir: "dist/.build/dll",
webpackDll: false,
persistGraphQL: false,
backendUrl: "http://{ip}:8080",
frontendRefreshOnBackendChange: true,
nodeDebugger: false,
defines: {
__DEV__: process.env.NODE_ENV !== 'production',
__GRAPHQL_URL__: '"http://localhost:8080/graphql"',
},
}
};
config.options.devProxy = config.options.ssr;
if (process.env.NODE_ENV === 'test') {
}
if (process.env.NODE_ENV === 'production') {
// Generating source maps for production will slowdown compilation for roughly 25%
config.options.sourceMap = false;
}
const extraDefines = {
__SSR__: config.options.ssr,
__PERSIST_GQL__: config.options.persistGraphQL,
__FRONTEND_BUILD_DIR__: `"../frontend-server/dist/web"`,
__DLL_BUILD_DIR__: `"../frontend-server/dist/build/dll"`
};
config.options.defines = Object.assign(config.options.defines, extraDefines);
module.exports = config;
latest webpack issue with clean-webpack-plugin
With webpack version 4.46.0, we hitting into a bug with clean-webpack-plugin when setting output.path to / location here.
Reference react-cosmos/react-cosmos#1280
Will send a PR on it.
latest webpack and webpack-dev-server causing to load the webpack-dev-server package twice
Webpack-dev-server is getting loaded twice when using the latest webpack and webpack-dev-server.
"webpack version": "4.41.2"
"webpack-dev-server": "3.9.0"
From the browser console .log
index.2f5ee125b2932ecc10fc.js:145885 [WDS] Hot Module Replacement enabled.
index.2f5ee125b2932ecc10fc.js:145889 [WDS] Live Reloading enabled.
index.2f5ee125b2932ecc10fc.js:146069 [WDS] Hot Module Replacement enabled.
index.2f5ee125b2932ecc10fc.js:146073 [WDS] Live Reloading enabled.
From the browser console, we see
__webpack_require__("../../node_modules/webpack-dev-server/client/index.js?http://localhost:3000");
__webpack_require__("../../node_modules/webpack/hot/dev-server.js");
__webpack_require__("../../node_modules/raf/polyfill.js");
__webpack_require__("../../node_modules/webpack/hot/dev-server.js");
__webpack_require__("../../node_modules/webpack-dev-server/client/index.js?http://localhost:3000/");
module.exports = __webpack_require__("./src/index.tsx")
After investigating the issue, I found out that zen adds the following in dev environment which is also been added from webpack-dev-server from the latest version.
debug [web] = { entry:
{ index:
[ 'raf/polyfill',
'webpack/hot/dev-server',
'webpack-dev-server/client?http://localhost:3000/',
'./src/index.tsx' ] },
name: 'web',
....
...
}
https://github.com/sysgears/larix/blob/master/packages/zen/src/plugins/WebpackPlugin.ts#L470
Can this be corrected for version greater than >3.1?
instead
index: (zen.dev ? ['webpack/hot/dev-server', "webpack-dev-server/client?" + webpackDevURL + "/"] : []).concat([
builder.entry || './src/client/index.js'
])
to
if(webpackDevServerVersion > 3.1) {
index: ([
builder.entry || './src/client/index.js'
])
} else {
index: (zen.dev ? ['webpack/hot/dev-server', "webpack-dev-server/client?" + webpackDevURL + "/"] : []).concat([
builder.entry || './src/client/index.js'
])
}
I cannot figure out how to create aliases with Zen & Typescript
Is it possible to build a config for a TS project that uses path aliases? I'd like to alias package paths in a monorepo. I can't seem to get this to work after spending days trying everything I can think of. All I could think of was to open an issue, maybe someone can recommend something? Thank you.
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.