easy-team / egg-vue-typescript-boilerplate Goto Github PK
View Code? Open in Web Editor NEWEgg Vue TypeScript Server Side Render (SSR) / Client Side Render (CSR)
Home Page: https://easyjs.cn/egg-vue
License: MIT License
Egg Vue TypeScript Server Side Render (SSR) / Client Side Render (CSR)
Home Page: https://easyjs.cn/egg-vue
License: MIT License
// app/web/framework/app.ts
import 'normalize.css';
2020-03-11 17:47:29,461 ERROR 58250 [admin/home.js] server render bundle error, try client render, the server render error //egg-vue-typescript-boilerplate/node_modules/normalize.css/normalize.css:11
html {
^
SyntaxError: Unexpected token {
at Module._compile (internal/modules/cjs/loader.js:721:23)
at Module._extensions..js (internal/modules/cjs/loader.js:787:10)
at Object.require.extensions.(anonymous function) [as .js] (/Users/funkyLover/Desktop/egg-vue-typescript-boilerplate/node_modules/ts-node/src/index.ts:431:14)
at Module.load (internal/modules/cjs/loader.js:653:32)
at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
at Function.Module._load (internal/modules/cjs/loader.js:585:3)
at Module.require (internal/modules/cjs/loader.js:690:17)
at require (internal/modules/cjs/helpers.js:25:18)
at r (/Users/funkyLover/Desktop/egg-vue-typescript-boilerplate/node_modules/vue-server-renderer/build.dev.js:9310:16)
at eval (webpack:///external_%22normalize.css%22?:1:18)
at Object.normalize.css (__vue_ssr_bundle__:1069:1)
at __webpack_require__ (__vue_ssr_bundle__:26:30)
at eval (webpack:///./app/web/framework/app.ts?:6:71)
at Module../app/web/framework/app.ts (__vue_ssr_bundle__:368:1)
at __webpack_require__ (__vue_ssr_bundle__:26:30)
at eval (webpack:///./app/web/page/admin/home/index.ts?:2:72)
eggjs官方并没特别支持typeORM
还是说是建议用官方推荐的egg-sequelize呢?
${root}/webpack.config.js
引入ts-import-plugin无效
给登录页加上路由后,登录页依旧报错。
在我自己的项目里,使用renderClient也报错。
报错内容:render function or template not defined in component: anonymous
"egg-view-vue-ssr": "^3.0.5",
"egg-webpack": "^4.4.9",
"egg-webpack-vue": "^2.0.2",
"vue": "^2.5.21",
"vue-property-decorator": "^7.2.0",
"vue-router": "^3.0.2",
"vuex": "^3.0.1",
"vuex-class": "^0.3.1",
"vuex-router-sync": "^5.0.0"
Hello easy-team,
I really like your tools!
I tried upgrading this example to webpack 5 by upgrading the following dependencies:
"easywebpack-cli": "^5.0.0"
"easywebpack-vue": "^5.0.1"
"egg-webpack": "^5.0.1"
However it does not work ... the generated browser code is not executable.
Could you give it a try?
Miguel
想根据app/web/page/admin/home/
的例子来改,结果焦头烂额
希望可以增加一个简单的不使用vuex和vue-router的服务器单页渲染例子
在layout里面的index.vue中(app/web/component/layout/admin/index.vue
)
用来显示首页的地方
在<head>
内试着插入cdn连结,假设polyfill.js
插入<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>
后
执行npm run dev
,webpack打包过程就会停住完全不动
个人猜测是把js的内容一起打包进去所以导致特别久,但不确定对不对
2019-04-17 09:13:57,774 INFO 2428 [master] node version v11.14.0
2019-04-17 09:13:57,776 INFO 2428 [master] egg version 2.21.1
2019-04-17 09:14:03,577 INFO 2428 [master] agent_worker#1:9892 started (5544ms)
2019-04-17 09:14:07,843 INFO 2428 [master] egg started on http://127.0.0.1:7001 (10067ms)
webpack build [========== ] 10% (0.0 seconds)
[webpack-tool] start webpack node building server: http://127.0.0.1:9001
webpack build [========== ] 10% (0.0 seconds)
[webpack-tool] start webpack web building server: http://127.0.0.1:9000
webpack build [============= ] 13% (2.9 seconds)
自己试过的方向:
npm cache clean --force
,一样无效PS: 有使用npm-check-updates把所有套件都更新到最新,且使用目前最新版本的Node.Js
先谢谢协助了
这个项目里 vue不想使用ts,只有egg使用ts。该如何配置?
这个模版能写两个最简单的demo么,我是第一次用,之前也没写过vue
在现有的模版中:
router.get('/login', controller.admin.login)
,得到的是一个仅有 layout.html 里的公共代码的空白页面弄了几天了。还是没搞定
使用脚手架构建项目 出现如下错误:
`> egg-bin dev -r 'egg-ts-helper/register'
Error: Cannot find module ''egg-ts-helper/register''
at Function.Module._resolveFilename (module.js:536:15)
at Function.Module._load (module.js:466:25)
at Module.require (module.js:579:17)
at Function.Module._preloadModules (module.js:736:12)
at preloadModules (bootstrap_node.js:471:38)
at startup (bootstrap_node.js:184:9)
at bootstrap_node.js:608:3
-vue-typescript","framework":"D:\www\egg-vue-typescript\node_modules\egg","workers":1} exit with code 1
DEBUG=common-bin
for detail
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] dev: egg-bin dev -r 'egg-ts-helper/register'
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Raytine\AppData\Roaming\npm-cache_logs\2018-09-12T16_09_28_549Z-debug.log `
在app/web/page/app/app.vue
里面增加了一句const a:string = 'a'
,编译报错
ERROR in ./app/web/page/app/app.vue (./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./app/web/page/app/app.vue)
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: Unexpected token (18:7)
16 | sync(store, router);
17 |
> 18 | const a:string = 'a'
| ^
19 |
20 | export default {
21 | router,
@ ./app/web/page/app/app.vue 3:0-109 3:0-109 4:0-122 17:2-16
@ ./node_modules/babel-loader/lib!./app/web/framework/vue/entry/client-loader.ts!./app/web/page/app/app.vue
@ multi (webpack)-hot-middleware/client?path=http://10.254.48.36:9000/__webpack_hmr&noInfo=false&reload=false&quiet=false babel-loader!./app/web/framework/vue/entry/client-loader.ts!./app/web/page/app/app.vue
egg2.6 TypeScript tool support,是否有计划更新ts版的脚手架
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.