art-template在命令行工具run start后报错

art-template在命令行工具run start后报错

# 我创建的.art文件未显示成html文件,请问是需要哪个插件呢?

觉得自己在webpack.config.js中的配置没啥问题呢?

# 报错信息的截图

http://img1.sycdn.imooc.com//climg/5fe2019809cd5f0118240742.jpg

http://img1.sycdn.imooc.com//climg/5fe201d1098337b409680665.jpg
# 尝试过的解决思路和结果

# 粘贴全部相关代码,切记添加代码注释(请勿截图)

const path = require('path');

const HtmlWebpackPlugin = require('html-webpack-plugin');


//获取绝对路径

const resolve = dir => path.resolve(__dirname,dir);


module.exports = {

  mode:'development',

  // webpack入口文件

  entry:{

    index:'./src/index.js',

    list:'./src/list.js'

  },

  // webpack输出路径

  output:{

    //输出的目录

    path:resolve('dist'),

    filename:'js/[name].js'

  },

  //source-map:调试用的,出错时将直接定位到原始代码

  devtool:'cheap-module-eval-source-map',


  module:{

    rules:[

      {

        test:/\.art$/,

        loader:'art-template-loader'

      }

    ]

  },


  plugins:[

    new HtmlWebpackPlugin({

      template:'./index.art',

      filename:'index.html',

      chunks:['index']

    }),

    new HtmlWebpackPlugin({

      template:'./list.art',

      filename:'list.html',

      chunks:['list']

    })

  ]

}


正在回答

登陆购买课程后可参与讨论,去登陆

2回答

同学你好,问题解答如下:

1、src属于项目的入口文件,要将.art文件都放到src中,目录结构如下:

http://img1.sycdn.imooc.com//climg/5fe2b192099668da09280203.jpg

http://img1.sycdn.imooc.com//climg/5fe2b1a309626a0c08430235.jpg

然后.art文件中,模板的路径要对应调整如下:

http://img1.sycdn.imooc.com//climg/5fe2b1e109b95b6808410414.jpg

webpack.config.js中的插件路径也要对应调整:

http://img1.sycdn.imooc.com//climg/5fe2b2090912629a06450600.jpg

这样调整后,经过测试,可以正确打包成功。

2、如果art-template没有安装成功,也会造成打包不成功,建议将node_modules文件夹删除,重新执行npm install ,多安装几遍试试。或者下载源码,测试一下源码,看源码能不能打包成功,再对比自己的项目。

3、如果想让.art文件,显示成html,可以如下这样调整:

http://img1.sycdn.imooc.com//climg/5fe2b382096068be13151006.jpg

祝学习愉快!

  • 老师你好,为什么.art文件都要放在src中,不放在src中可以吗?哪里规定了要放在src中呢?我试过不放在src中却一直报错,打包不了

    2022-02-26 15:05:39
  • 同学你好,art-template这个模板默认要求在某一个文件夹下,不能放到根目录中。放到src中,是我们约定俗称的做法,建议同学当成固定用法,记住。

    2022-02-26 17:52:14
  • 好的,我会记住的,谢谢老师!

    2022-02-26 20:07:08
沐寒528 提问者 2020-12-23 10:11:45

"main""webpack.config.js",


pack.json中的配置有一项未修改


问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师