[内容]
【报Bug】使用 cli 方式启动项目,如果自定义了 webpack 一些路径解析,就会报错文件查找失败:'uni-pages' at main.js:3
重现步骤
[步骤]
- 定义 vue.config.js
-
定义 configureWebpack 方法
configureWebpack: config => { Object.assign(config, { resolve: { extensions: ['.js', '.json', '.vue', '.scss', '.css'], alias: { '@': path.resolve('src'), 'src': path.resolve(__dirname, './src'), 'project': path.resolve(__dirname, './src/project'), 'common': path.resolve(__dirname, './src/common'), '@@': path.resolve(__dirname, './src/utils'), 'components': path.resolve(__dirname, './src/components'), 'filters': path.resolve(__dirname, './src/filters'), 'directives': path.resolve(__dirname, './src/directives'), 'tpc': path.resolve(__dirname, './src/thirdPartyComponents'), 'diff': path.resolve(__dirname, './src/diff') } } }) }
[结果]
文件查找失败:'uni-pages' at main.js:3
[期望]
修复,或者给一个能自定义别名的方式
## uni-app运行环境说明
[运行端是h5或app或某个小程序?]
微信小程序
[项目是cli创建的还是HBuilderX创建的?如果是cli创建的,请更新到最新版cli再试]
cli 创建的项目
[编译模式是老模板模式还是新的自定义组件模式?]
自定义组建模式
[可重现代码片段]
vue.config.js
```javascript
const path = require('path')
module.exports = {
// 如果这个值是一个对象,则会通过 webpack-merge 合并到最终的配置中
// 如果你需要基于环境有条件地配置行为,或者想要直接修改配置,那就换成一个函数 (该函数会在环境变量被设置之后懒执行)。该方法的第一个参数会收到已经解析好的配置。在函数内,你可以直接修改配置,或者返回一个将会被合并的对象
configureWebpack: config => {
if (process.env.NODE_ENV === 'production') {
// 为生产环境修改配置...
} else {
// 为开发环境修改配置...
}
if (process.env.NODE_ENV === 'production') {
// 为生产环境修改配置...
} else {
// 为开发环境修改配置...
// 这里通过自定义 VUE_APP_CURRENTMODE判断环境
switch (process.env.VUE_APP_CURRENTMODE) {
case 'development':
console.log('当前运行在 dev')
break
case 'test':
console.log('当前运行在 test')
break
default:
break
}
}
/* TODO: 这里的别名设置和 uni 内置的 loader 冲突 */
//
Object.assign(config, {
resolve: {
extensions: ['.js', '.json', '.vue', '.scss', '.css'],
alias: {
// 'vue$': 'vue/dist/vue.runtime.esm.js',
'@': path.resolve('src'),
'src': path.resolve(__dirname, './src'),
'project': path.resolve(__dirname, './src/project'),
'common': path.resolve(__dirname, './src/common'),
// '@@': path.resolve(__dirname, './src/utils'),
'components': path.resolve(__dirname, './src/components'),
'filters': path.resolve(__dirname, './src/filters'),
'directives': path.resolve(__dirname, './src/directives'),
'tpc': path.resolve(__dirname, './src/thirdPartyComponents'),
'diff': path.resolve(__dirname, './src/diff')
}
}
})
},
// 对内部的 webpack 配置(比如修改、增加Loader选项)(链式操作)
chainWebpack: config => {
config.module
.rule('vue')
.use('vue-loader')
.loader('vue-loader')
.tap(options => {
// 修改它的选项...
return options
})
},
// css的处理
css: {
// 当为true时,css文件名可省略 module 默认为 false
modules: true,
// 是否将组件中的 CSS 提取至一个独立的 CSS 文件中,当作为一个库构建时,你也可以将其设置为 false 免得用户自己导入 CSS
// 默认生产环境下是 true,开发环境下是 false
extract: false,
// 是否为 CSS 开启 source map。设置为 true 之后可能会影响构建的性能
sourceMap: false,
// 向 CSS 相关的 loader 传递选项(支持 css-loader postcss-loader sass-loader less-loader stylus-loader)
loaderOptions: {
css: {},
sass: {
// data: `@import "@/uni.scss"`
},
stylus: {}
}
},
// 所有 webpack-dev-server 的选项都支持
devServer: {},
// 是否为 Babel 或 TypeScript 使用 thread-loader
parallel: require('os').cpus().length > 1,
// 向 PWA 插件传递选项
pwa: {},
// 可以用来传递任何第三方插件选项
pluginOptions: {}
}
package.json
{
"name": "wehotelBookingMp",
"version": "0.1.0",
"private": true,
"scripts": {
"test": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service --mode test uni-build --watch",
"lint": "vue-cli-service lint",
"build-dev": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service --mode development uni-build",
"build-preprod": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service --mode preprod uni-build",
"build-prod": "cross-env NODE_ENV=production UNI_PLATFORM=mp-weixin vue-cli-service --mode prod uni-build",
"build-test": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service --mode test uni-build",
"dev": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service --mode development uni-build --watch",
"info": "node node_modules/@dcloudio/vue-cli-plugin-uni/commands/info.js",
"preprod": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service --mode preprod uni-build --watch"
},
"dependencies": {
"@dcloudio/uni-app-plus": "*",
"@dcloudio/uni-h5": "*",
"@dcloudio/uni-mp-alipay": "*",
"@dcloudio/uni-mp-baidu": "*",
"@dcloudio/uni-mp-qq": "*",
"@dcloudio/uni-mp-toutiao": "*",
"@dcloudio/uni-mp-weixin": "*",
"cross-env": "^5.2.0",
"flyio": "^0.6.2",
"lodash": "^4.17.11",
"moment": "^2.24.0",
"regenerator-runtime": "^0.12.1",
"vue": "^2.6.10",
"vuex": "^3.0.1"
},
"devDependencies": {
"@dcloudio/uni-cli-shared": "*",
"@dcloudio/uni-template-compiler": "*",
"@dcloudio/vue-cli-plugin-hbuilderx": "latest",
"@dcloudio/vue-cli-plugin-uni": "latest",
"@dcloudio/webpack-uni-mp-loader": "*",
"@dcloudio/webpack-uni-pages-loader": "*",
"@types/html5plus": "*",
"@types/uni-app": "*",
"@vue/cli-plugin-babel": "3.5.1",
"@vue/cli-plugin-eslint": "^3.8.0",
"@vue/cli-service": "^3.8.0",
"@vue/eslint-config-standard": "^4.0.0",
"babel-eslint": "^10.0.1",
"babel-plugin-import": "^1.11.0",
"eslint": "^5.16.0",
"eslint-plugin-vue": "^5.0.0",
"postcss-comment": "^2.0.0",
"sass": "^1.21.0",
"sass-loader": "^7.1.0",
"stylus": "^0.54.5",
"stylus-loader": "^3.0.2",
"vue-template-compiler": "^2.6.10"
},
"browserslist": [
"last 3 versions",
"Android >= 4.4",
"ios >= 8"
]
}
联系方式
[QQ] 734387564
1 个回复
大头兵
兄弟,问题解决了吗?我碰到了相同的问题